Below is my question;

Form Field Validation and Error Messages

Overview

You have created a basic form and added interactivity to images using JavaScript. Now it is time to validate information entered into your form fields. You will use the "registration.html" file found in your Zip file. You will see that the page has a form with the following fields to allow users to register for an account. The items in parentheses are defined formatting instructions to be observed for each field.

• Username* (must only contain letters and numbers)
• Password* (minimum of 8 characters)
• PasswordVerify* (minimum of 8 characters, must match password)
• FirstName* (text string)
• LastName* (text string)
• Email (uses x..x@xxx.xxx format)
• PhoneNumber (uses (xxx) xxx-xxxx format)
• SignUpNewsletter (radio box for yes/no)

Directions

Read the assignment overview.

Use the registration.html file to add functionality to the form found on the page. The JavaScript that you write should validate each field and, if errors are made, display appropriate error messages that direct the user to complete the form properly. Once the form is completed, your script should open the confirmation page (confirmation.php).

Note:The input fields in the form with an asterisk are required fields.

Make sure to do the following:

• JavaScript that defines that a field is required and generates an appropriate error message if the field has not been completed.
• JavaScript to validate all input fields per the formatting definitions that the field values should be checked against (found in the overview) after each field.
• JavaScript that displays an appropriate error correction message (next to the field) in the event a form entry error has been made.
• JavaScript that will default the user's cursor to the first erroneous input field in the event that there is an input error.
• Submit button that executes the validation when submitted.
• Once completed, view your pages in each of your two selected Web browsers to see if the content renders appropriately and consistently within each. Next, verify that your code is error free using the appropriate browser specific development tool found in the Resources.
• Take a screen capture of each of your validation results and save it for submission.

Below is the html code;

registration.html........

CapellaVolunteers.org

• Home

• Invitation

• Volunteers

• Gallery

• Registration

Username:

Password:

Verify your Password:

First Name:

Last Name:

Email:

Phone Number

Sign up for newsletter:

Yes

No

This events site is for IT3515 tasks.

Kindly include theconsole.log();in other to check the developer tool console.

Thank you!