Skip to main content

JavaScript Form Events — exercises and bug fixes

5 hands-on exercises and 5 find-the-bug challenges for the JavaScript Form Events lesson. Every one is checked automatically in the browser — write the code, run it, and the tests tell you what still fails.

Sign in to start solvingCreate a free account

Exercises(5)

  1. 1

    Handle a submit

    easy10 min

    Stop the reload and report the name that was submitted.

  2. 2

    Count characters live

    easy10 min

    Report how many characters the field holds as it changes.

  3. 3

    Handle a change

    easy10 min

    Report the chosen size when the select changes.

  4. 4

    Validate on submit

    easy10 min

    Report a message when the field is empty.

  5. 5

    Handle blur

    medium10 min

    Report Left when the field loses focus.

Find the bug(5)

  1. 1

    Fix the missing preventDefault

    easy8 min

    Without it the browser would reload the page.

  2. 2

    Fix the listener on the button

    easy8 min

    submit belongs to the form, so pressing Enter would be missed.

  3. 3

    Fix change used for live feedback

    easy8 min

    change does not fire on every keystroke, so input is needed.

  4. 4

    Fix the validation without trim

    easy8 min

    A field of spaces should still count as empty.

  5. 5

    Fix focus used instead of blur

    easy8 min

    The report should happen when the field is left.

Ready to write the code?

The editor, the automatic checks and the worked solutions open up with an account.

Open the workspace