for the following java script code follow the directions below

Hands-on Project 6-1

Personal Information

Street Address

City

State/Province

Zip/Postal Code

Social Security Number

Social Security Number (continued)

Social Security Number (end)

1. Return to the index.htm file in your browser, within the body section, just before the clos- ing tag, add a script element, and then specify the file script.js as the source.

.2. In the opening

tag, add code to disable browser-based validation, and then save your changes.

3.. In the script.js file, add code instructing processors to interpret the contents in strict mode, and then create a global variable named formValidity and set its value to true.

4.

4. add the following function to validate the required form elements

/* validate required fields */

function validateRequired() {

var inputElements = document.querySelectorAll(

"#contactinfo input");

var errorDiv = document.getElementById("errorText");

var elementCount = inputElements.length;

var requiredValidity = true;

var currentElement;

try {

for (var i = 0; i < elementCount; i++) {

// validate all input elements in fieldset

currentElement = inputElements[i];

if (currentElement.value === "") {

currentElement.style.background = "rgb(255,233,233)";

requiredValidity = false;

} else {

currentElement.style.background = "white";

}

}

if

(requiredValidity === false) {

throw "Please complete all fields.";

}

errorDiv.style.display =

errorDiv.innerHTML = "";

}

"none";

catch(msg) {

errorDiv.style.display =

errorDiv.innerHTML = msg;

formValidity = false;

} }

5. Add the following function to create an event listener for the submit event:

/* create event listeners */

function createEventListeners() {

var form = document.getElementsByTagName("form")[0];

if (form.addEventListener) {

form.addEventListener("submit", validateForm, false);

} else if (form.attachEvent) {

form.attachEvent("onsubmit", validateForm);

}

}

6.

Add the following code to call the createEventListeners() function when the page finishes loading:

/* validate form */

function validateForm(evt) {

if (evt.preventDefault) {

evt.preventDefault(); // prevent form from submitting

} else {

evt.returnValue = false; // prevent form from submitting

in IE8

}

formValidity = true; // reset value for revalidation

validateRequired();

. if (formValidity === true) {

document.getElementsByTagName("form")[0].submit();

}

}

7. Add the following code to call the createEventListeners() function when the page finishes loading:

/* run setup functions when page finishes loading */

if (window.addEventListener) {

window.addEventListener("load", createEventListeners, false);

} else if (window.attachEvent) {

window.attachEvent("onload", createEventListeners);

}

8. addthefollowingfunctiontovalidate input elements with the number type:

/* validate number fields for older browsers */

function validateNumbers() {

var numberInputs = document.querySelectorAll(

"#contactinfo input[type=number]");

var elementCount = numberInputs.length;

var numErrorDiv = document.getElementById("numErrorText");

var numbersValidity = true;

var currentElement;

try {

for (var i = 0; i < elementCount; i++) { // validate all input elements of type "number" in fieldset currentElement = numberInputs[i]; if (isNaN(currentElement.value) || (currentElement.value

=== "")) {

currentElement.style.background = "rgb(255,233,233)";

numbersValidity = false;

} else {

currentElement.style.background = "white";

} }

if

(numbersValidity === false) {

throw "Zip and Social Security values must be numbers.";

}

numErrorDiv.style.display = "none";

numErrorDiv.innerHTML = "";

}

catch(msg) {

numErrorDiv.style.display = "block";

9.

9. In the validateForm()function,add a call to the validate Numbers()function as follows:

function validateForm(evt) {

if (evt.preventDefault) {

evt.preventDefault(); // prevent form from submitting }else{

evt.returnValue = false; // prevent form from submitting

in IE8

formValidity = true; // reset value for revalidation

validateRequired();

validateNumbers();

if (formValidity === true) {

document.getElementsByTagName("form")[0].submit();

}

}