Project 1

In this exercise, you will total the prices for items selected on an order form, using both a for statement and an if statement. Youll also add an event listener to the Submit button that supports both modern browsers and older version of Internet Explorer.

1. In your text editor, open index.htm from the HandsOnProject3-1 folder in the Chapter03 folder. Update the comment section
2. At bottom of the document, before the closing tag, enter to create a new script section.
3. Within the script section you created in the previous step, enter the following function:

//function to add values of selected check boxes and display total

function calcTotal() {

}

4. Within the function braces, define the following global variables:

var itemTotal = 0;

var items = document.getElementsByTagName(input);

5. Below the global variables, enter the following for statement:

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

if (items[i].checked) {

itemTotal += (items[i].value * 1);

}

}

6. Below the closing } for the for statement, enter the following statement to write the result to the web document: document.getElementById(total).innerHTML = Your order total is $ + itemTotal + .00;
7. Below the closing } for the function, enter the following code to create an event listener thats compatible with older versions of Internet Explorer.

// add backward compatible event listener to Submit button

var submitButton = document.getElementById(sButton);

if (submitButton.addEventListener) {

submitButton.addEventListener(click, calcTotal, false);

} else if (submitButton.attachEvent) {

submitButton.attachEvent(onclick, calcTotal);

8. Save your work, open index.htm in a browser, check Fried Chicken and Side Salad then click Submit. You should see Your order total is $14.00 on the right hand side of the box.
9. Zip your file(s) and upload your finished file to the Javascript Inclass Exercise 3 folder on myTCC