Question: Hands - On Task 1 :Form Validation test In this project you will program the actions of a sign - up form in which users
HandsOn Task :Form Validation test
In this project you will program the actions of a signup form in which users must supply a username, email address, and password for a new account. Passwords must be at least eight characters long and contain at least one letter and one number. As a validation test, the password must be entered twice to confirm that the user did not inadvertently mistype the password. If the password does not match the required pattern or if the two passwords are not identical, the password field should be flagged as invalid. A preview of the form in which the passwords are mismatched is shown in the image provided. SHOW HTML AND JS CODE PLEASE.
Instructions:
Open the provided tasktemplatefolder' in your code editor.
Use your code editor to open the taskhtml and taskjs files from the tasktemplatefolder folder in the cloned repository.
Go to the taskhtml file in your code editor and the head section add a script element to add the taskjs file to add the external JavaScript file.
Take some time to study the signup form. Note that the pwd field contains a regular expression pattern that will be used to verify that the password is in the proper format. Save your changes to the file.
Go to the taskjs file in your code editor. Below the comment section declare the following variables: submitButton referencing the element with the id submitButton pwd referencing the element with the id pwd and pwd referencing the element with the id pwd
Create an event listener for the click event occurring with the submit button that runs an anonymous function.
Within the anonymous function add the following if else structure:
If the pwd field fails the pattern match, display the validation message Your password must be at least characters with at least one letter and one number
Else if the value of the pwd field does not equal the value of the pwd display the validation message Your passwords must match
Otherwise, set the validation message to an empty text string.
Save your changes to the file and then open taskhtml in your web browser.
Verify that you cannot submit the form if your password is less than eight characters long and does not include at least one number and one letter.
Verify that you cannot submit the form if the two passwords do not match.
Step by Step Solution
There are 3 Steps involved in it
1 Expert Approved Answer
Step: 1 Unlock
Question Has Been Solved by an Expert!
Get step-by-step solutions from verified subject matter experts
Step: 2 Unlock
Step: 3 Unlock
