Page 183 - DCAP408_WEB_PROGRAMMING

Unit 6: DOM Model

Notes
Figure 6.3

Task Create a web page, which takes input from the user, and send an alert message to
the user if he has failed to fill in the required fields. Use the onSubmit event handler is to
validate the form input. In this way you can verify whether users have filled in required
fields, made the required selection, or whether they have filled in an appropriate
combination of fields.

Self Assessment

Fill in the blanks:
8. Every element on a web page has certain events which can trigger a ………………….

9. The …………………. function will be called when the user clicks the submit button in the
form.
10. The …………………. event is used to validate ALL form fields before submitting it.

11. onMouseOver and …………………. are often used to create “animated” buttons.
6.3 How to use Forms in JavaScript

6.3.1 Form Validation with JavaScript

JavaScript can be used to validate data in HTML forms before sending off the content to a server.
Form data that typically are checked by a JavaScript could be:
 Has the user left required fields empty?

 Has the user entered a valid e-mail address?
 Has the user entered a valid date?
 Has the user entered text in a numeric field?
Form validation is the process of checking that a form has been filled in correctly before it is
processed.

Example: If your form has a box for the user to type their e-mail address, you might want
your form handler to check that they’ve filled in their address before you deal with the rest of
the form.

LOVELY PROFESSIONAL UNIVERSITY 177