codex-lv2-may-2025

Level Navigation: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 Current Level: 21 22 23 24 25 26 27 28 29 30 31 32


đź§Ş Level 21: Capture Input on Click

What You’ll Do

Capture the user’s input when they click the Send button.

Instructions

In the button’s click handler (from Step 2), after validation and “Thinking…”, set userPrompt from the input (getValue(...) or direct DOM). Log once: console.log("userPrompt:", userPrompt).

đź’ˇ Code Hints

Capturing user input? You’ll need to get the value from the input field and store it in your variable. Check out the Input/Output section in SNIPPETS.md for the right function.

âś… Check

  1. Open your webpage in a browser
  2. Type something in the input field (like “Hello there”)
  3. Open Chrome DevTools (F12) and go to the Console tab
  4. Click your Send button
  5. You should see “userPrompt: Hello there” (or whatever you typed) in the Console
  6. If you see “userPrompt: undefined” or nothing, check that:
    • You’re calling getValue with the correct input ID
    • The input field has the correct ID attribute
    • You’re setting userPrompt after the validation check

Next: Level 22 - Use Input in Model Call



Level Navigation: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 Current Level: 21 22 23 24 25 26 27 28 29 30 31 32