CSC 105

Forms Lab

Part Four: Form Checking Lab

The purpose of this exercise is to provide you with some practice on form auto-updating and checking. You should be able to complete the exercise by following the instructions below.

To Do

The order form below is not completely finished. The cost box is supposed to auto-update to reflect the cost of the broom selected. Can you make it work properly? The beginnings of an update() function have been provided for you.

  1. Add an event trigger to the menu so that update() gets called when the menu selection changes.
  2. Finish writing the function, so that it updates the value shown in the cost box

Also, the form should not be submitted if no model has been selected. Add an appropriate event trigger that will call the isFormOk() function when the user tries to submit, then finish writing the function so that submission will be blocked when appropriate. If you block submission, you should pop up an alert box so that the user knows why nothing has happened.

In case you need some review, here are a few related examples: form updating, and form checking/submission blocking. There's also an example of link blocking, which works in a similar manner.

Order Form