Task

You're building a form where users can submit their details. Your goal is to validate user input, provide real-time feedback as they type, and prevent form submission if the input is invalid.

1. Real-Time Input Feedback:

   • Listen for changes as the user types;

   • Inside the event handler, check the length of the input value;

   • If it's less than 3 characters, set the content of the <p> with ID feedback to "Name is too short.";

   • If it's 3 characters or more, set feedback to "Name looks good!".

2. Prevent Default Form Submission:

   • Listen for form submissions;

   • Stop the form from the default submitting behavior;

   • Check the input value;

   • If it's less than 3 characters, display "Please enter a longer name" in the <p> with ID form-message;

   • If it's 3 characters or more, display "Form submitted successfully!" in form-message.

• Use the input event to listen for changes as the user types;

• Use event.target.value.length < 3 to check the length of the input value;

• Use the submit event to listen for form submissions;

• Use event.preventDefault() to stop the form from the default submitting behavior;

• Use nameInput.value.length < 3 to check the input value.