JavaScript : Form Validation

Form validation is one of the most useful applications for JavaScript. You can process the form, and try to insure that the proper information is submitted on the client side, before sending it to the server. This saves the user time if they make a small error, and it saves server resources because it does not have to process each form, and possible return the form to be completed.

The following form checks for two things, the first is that the form is not empty. Something needs to be added. The next thing it checks for is that their our no bad words used in the form. The bad words can be defined to be anything, in this example they are: "internet", "intranet", and "extranet"

Another thing this form does is bypass the verfication process after the first error was returned. This can be useful if you want to use the verification process as more a warning, or reminder for people to input the proper data, but not necessarily exclude them from inputing data all data. I can see this as useful for search engines, I saw a somewhere that on the Yahoo Search Engine there were something like 5,000 searches a month for the word "yahoo."

To see how this was done, use View | Page Source in your browser. Basically it just reads the value from the form, checks if it is null, parses it into individual words and then checks these words against the list of bad words.

If you need some solid, complex form validation done, Netscape has put together a script which can verify the form data, examples are valid Zip Code, Phone Numbers, Credit Cards, State Abbreviations and tons more. Their verification process uses "Regular Expressions" (a perl thing) which is in JavaScript 1.2 (Navigator 4.0). Regular Expressions can dice up strings and match patterns very easily, once you get to know how to use them.

Related Links:

Check out Netscape's Form Validation and Regular Expression examples at Netscape's DevEdge Online JavaScript