codex-lv2-may-2025

Level Navigation: 1

Current Level: 25

🧪 Level 25: Empty Input Handling

What You’ll Do

Add input validation to handle empty user input gracefully.

Why validation matters: Professional applications always check user input before processing it. This prevents errors and provides helpful feedback to users.

Instructions

Add a condition for when the input is empty:

Show a warning message in the output area
Change its style to indicate an error state

🔄 If Statement Refresher

Before we start, let’s review how if statements work! You used these in Week 3 for game controls and sprite interactions.

Basic If Statement Structure

if (condition) {
    // code to run if condition is true
}

Examples from Week 3

Checking if a key is pressed:

if (keyDown("LEFT_ARROW")) {
    player.x = player.x - 5;
}

Checking if a sprite is off screen:

if (platform.y > 400) {
    platform.y = -50;  // move back to top
}

Checking if sprites are touching:

if (player.isTouching(item)) {
    score = score + 1;
    item.x = randomNumber(50, 350);
}

Checking if input is empty:

var userInput = "";

userInput = getValue("user-chat-input");
if (userInput === "") {
    // show warning message that no input is there
} else {
    // User has input a prompt. OK to proceed with query.
}

For This Level

You’ll need to check if the input field is empty. An empty input field has a value of "" (empty string). You can test for this condition using === to compare the input’s value.

💡 Code Hints

Checking for empty input? You’ll need to use conditional logic to check if the input is empty and show different messages. Check out the Conditional Logic section in SNIPPETS.md for examples and the Helper Functions section for styling functions.

✅ Check

Open your webpage in a browser
Make sure the input field is empty
Click your Send button
You should see a warning message appear in the output area (like “Please enter a message”)
The message should be styled differently (maybe red text or different background)
Open Chrome DevTools (F12) and check the Console tab for any errors
If nothing appears, check that your condition is checking for empty input correctly

Next: Level 26 - Valid Input Handling

Level Navigation: 1

Current Level: 25