As briefly explained in Appendix A, Javascript is a typical typeless scripting language, a little casual in its approach to issues like variable declaration and scope. It has the usual programming constructs - sequence, selection, iteration, and function calls. It is possible to define classes; usually though, scripts use only instances of predefined classes that provide access to data about the browser, or information about the page containing the script, or information about a form in that page.
Javascript's roles include:
You may need to write data checking Javascript code; the other uses are best handled with automatic code generators.
Web based tutorials on Javascript include:
Naturally, Yahoo has a large collection of links to all kinds of Javascript related sites.
The example code here, which relates to the Pizza order form used in the text, illustrates only basics of data checking for forms. Such data checks are merely an optimization feature. If you check data entered in a form prior to submission, you can pick up cases where there are obvious errors or omissions. For example, you can detect when a user has not filled in an essential field such as their name, or when there are inappropriate data in something like a credit card number field (should be 13 to 16 decimal digits). Such form data will only be rejected by the server-side program; so there is no point in sending the data. Insetad, your script can pop-up an alert explaining the invalid inputs, giving the user a chance to complete or correct their submission.
You can never rely on Javascript checking; a user may have disabled the interpreter in their browser. All data validation done in Javascript on the client must be repeated in your server-side program.
The pizza form example requires that the user enter their name,
address, phone number etc, and select options that determine the pizza meal that is to be
delivered. The form tag has an onSubmit attribute that identifies
a Javascript function that is to be run prior to actual submission of the form data. This
Javascript function checks that there are some data in fields such as the name field. It
cannot validate a name, but it can refuse to submit the data if no name is provided. If
the fields all appear to have data, the script can calculate the cost of the pizza and
put up a dialog box seeking confirmation of the order. (Such cost calculations are
quite nice features to have in web pages, but they can lead to mainteance problems. If
pricing is changed, the web-site developers must remember to update two quite different
pieces of code - the Javascript in a web page, and the real calculation function used
in a server-side script.)
Pages using Javascript define their functions in the head section of the page. There you get any global variables along with function definitions.
The form is defined in the body
section of a page. The form
tag will contain an onSubmit attribute whose value is a code
fragment that invokes the defined
confirmPizza function that organizes the checks. The form is passed
as a parameter, using its declared name.
The
confirmPizza function starts with a series of calls to the
emptyField function; the code here accesses the values of the
strings in selected input fields, checking character by character for something
other than spaces. If any character is found, the field is assumed to contain
some valid data. If a field (e.g. email) is empty, the emptyField function returns true,
and the calling confirmPizza function displays an
alert with a warning message.
If there are data in the text input fields, the confirmPizza function
continues with calls to the
basecost function and other functions used to compute the cost of
the pizza order. When the cost has been computed, a
confirmation dialog is used to verify that the order should be submitted.