LAB 4 (20 pts)
DUE DATE: This lab is due at the beginning of lab on
Tuesday, February 27
ASSSIGNMENT:
This lab will consist of two parts. You will be required to make a new web page for each of the two parts. Make sure to place a link on your home page to the first page of assignment 4.
PART 1 (10 pts):
For part one you will be required to create a form in a table and program it to do the following:
-
The form will have four colors.
-
For each color you will need to provide an option for selecting the color as the best color or the worst color. The options can be provided by check boxes or radios.
-
Only one color is allowed to be selected as the best color.
-
Only one color is allowed to be selected as the worst color.
-
A color cannot be selected as both the worst color and the best color.
-
You should be able to select two different colors. One worst and one best.
-
The checkboxes or radios should initially be unchecked.
-
If you do the form using check boxes it is worth 8 points. To get the full 10 you will need to create the form and use radios.
The following is an ouput of what the form might look like, but it is not programmed to work as indicated above.
PART 2 (10pts):
For part 2 you will need to create a set a forms and use functions to make the forms interact with each other. Your page should have the following:
-
A textbox to hold a color
-
A set of four check boxes of four different items. Each item should have a price associated with it.
-
A textbox to hold a quantity.
-
A textarea to hold a reciept.
-
A reset button that will use the function clearAll();
-
A calculate button that will use the function getBasket().
-
The
clearAll()
function should uncheck the checkboxes, clear the text boxes and clear the text area.
-
The
getBasket()
function will get the selected item and selected color . It will then get the quantity from the text box and multiply it by the cost associated with the chosen item. It will then print the item, color, quanity and total cost to the text area. Multiple uses of the button should add on to the reciept and not erase previous purchses.
Here is an example of what the store front might look like after 2 purchases.
This is not functional it is only an example:
What to turn in:
Email your ta with your url when you have finished. At the begining of lab please hand in a
stapled
print out of your code.
Please include your name and section number or time on the assignment.