Input text

Most commonly, you will use JavaScript to validate a form onsubmit. I do not want to write the server side processing used when a form is submitted to a server program. I do not want to manage the e-mail used when a form is submitted by e-mail. So, for these examples, in cases where there is a submit, we will return false from submit, so there is no real submission.

Note that there are some odd interactions between the onchange, onsubmit, and other events. We may see some of these event interactions in these samples. These effects may be different in different browsers.

• If you tab from a changed input field, you only get the onchange event.
• If you press Enter in a changed input field, you get the onchange event, and may sometimes also get the onsubmit event too!
• submit event causes the onchange, and then onload events to happen too!
• Other events may cause the onchange to happen too!

This interaction between events can be confusing.

In this example, the user will type in the password box; onchange of the password, we will save the password in the hidden element. Then, onclick of the display button, we will display the password in the text box.

sample-1-form has a reset button. The JavaScript validation function just returns true; so the reset is always done, just as it would be if there were no validation function.

Note that the onreset attribute value contains the JavaScript code to invoke the validate function. Also note that the onreset attribute has the keyword return before the call to the validate function, so the return value from the validate function is returned when the onreset processing is complete. This return value must be true for the reset to actually happen.

sample-1-form has an ordinary button, labeled display.

sample-2-watcher has a reset button. The JavaScript validation function just returns true; so the reset is always done, just as it would be if there were no validation function.

Note that the onreset attribute value contains the JavaScript code to invoke the validate function. Also note that the onreset attribute has the keyword return before the call to the validate function, so the return value from the validate function is returned when the onreset processing is complete. This return value must be true for the reset to actually happen.

sample-2-watcher has an ordinary button, labeled display.

Reading assignments are in the text book, Java Script, A Beginner's Guide, Second Edition, by John Pollock; McGraw Hill / Osborne, ISBN 0-07-222790-7

There are no additional reading assignments.

Do NOT read the lecture notes before hearing the lecture. If you do, you will find the lecture very boring. Read the lecture notes if you do not attend the lecture, or if you wish to review the material.