Tutorial 12 - Validation Examples
This page demonstrates several examples of validation techniques.
Multiple Valid Answers
In some situations there are alternative answers that are equally correct. The validation function should then scan an array of correct answers looking for a match. Any match returns a true flag. Scan the source code for the validmany() routine.
| Name one color in the American flag: |
Multiple Field Validation
In many situations the same type of validity check has to be repeated over many fields. One simple method is to use the fact that if the name attribute is reused for several similar controls, an array is automatically set up to give unique pointers to each control value. Scan the source code for the validate()routine.
Note: To convert this form to one that is submitted by email using the mailto protocol, view my forms projects page. Most browsers do not allow the mailto protocol in the action attribute value.
Blank Fields Check
It is quite common to require at least some data in a field before submitting the form. This generic form uses the chkForm() function in jscode.js which can also clear a specified field (or 'all'). The example uses the old-fashioned table method for label/entrybox alignment.
Text Analysis
Word count analysis require breaking up (ie. parsing) the source text into words (ie. tokens) that are terminated (ie. delimited) with spaces or punctuation. Fortunately JavaScript has the built-in string method split() which breaks a string into array items based on a delimiter symbol. The CountWords() function in jscode.js shows how the text is first prepared by adding leading/lagging spaces and changing other white space into plain space by using the string method replace(). Then the split() method with space as its delimiter is used to place all the 'words' into an array called splitString. The length of this array is the number of words in the text.
Concordance is the counting of each occurrence of each word and providing the results in a table fashion either sorted by alpha or sorted by most frequently used. This type of utility quickly leads to creating a spell checker.
Example: Budget Form
Pro forma (aka projected) budgets distribute income into accounts based on percentages. In this form the account names and breakdown ratios can be easily altered by the user. Entries are saved in cookies. Note: Print only works correctly in MSIE browsers due to innerHTML non-standardization. Cut/paste the form from the page source and grab the code here. The number of accounts is parameterized (ie easily extendable).
Historical budgets record the actual amounts spent in each account and calculate total spent and percentages for each account. Targeted budgets record the total to be spent as well as the actual amounts spent. They calculate percentages spent and amount remaining. Budgets.zip is a working demo of a targeted budget form. It can be easily expanded or styled.
Example: Health Checkup Form
A Body Mass Index of more than 25 indicates that you are overweight. A BMI factor of 30 or more indicates obesity. Being overweight can cause many health problems such as heart disease, strokes and diabetes. And if you should live long enough there is an increased chance of Alzheimer's. Just a word to the wise. Grab the code here!.
Fuel Efficiency Converter
Our environment is under assault. We have NOT been good stewards of the land loaned to us by our Creator! The simple rules of REDUCE - REUSE - RECYCLE are not being followed.
Vehicle fuel emissions is a major factor of environmental pollution and is one of the few factors that individuals can help control. Reducing gas consumption also reduces our dependency on foreign oil and saves $$$ on the gas bill too! Careful driving, properly inflated tires, clean air filters and tuneups reduce consumption. The following utility can help you calculate your current fuel consumption as well as making comparisons with newer vehicles. Grab the code here!