Web form validation

Forms which result in database update always, query forms according to need, are to be validated whether contain expected values. Majority validation functions are well documented, therefore there is no need to repeat them here. I bring in only basic procedure of forms verification. More important than well filled-in form is validation of user rights to change data. How to do that you find in this article. In the end of article are a few words about using VBScript.

Form processing is impossible to do without scripts. At least on the server side have to run script, which process form content. On the client side (browser) usually is needed script to check form validity. While on the server side certainly your favourite language is used, on the client side, JavaScript which is standard for web browsers have to be used.

It is necessary to notify, that these pages are dedicated to intranets, where is no reason to switch off JavaScript in browser. On internet switched off script is possible and form validation, or multiple submit form blocking does not have to operate.

Form fields validation

The only one right way of writing validation script is hard to find. I show in procedure which one I'm using. For each certain form I prepare central validation function. Simple data type check is part of central script, complex data type check is done by help of common validation function.

Central validation function goes through all form input elements and tests their content. Each form field is tested separately, to be possible to activate unique alert if needed. Alert describes error location and script finishes with return value false, which interrupts form submitting. I do not feel that it is suitable to report all errors at once, anyhow user mostly repairs only one input error at a time. After positive validation of all form items, script eventually executes additional code and returns value true. After that the form is submitted.

Validation of some data type is not quite trivial, that is why common validtion function are prepared. Such functions can be used repeatedly. It does not matter if these functions are part of page code, or are linked as external library. Examples of common validation functions here are checkInt() or checkDate().

<script type="text/javascript">
function checkForm(myForm) {
  ...
  // --- inline check minimal text length ---
  if(myForm.part.value.length < 2) {
    alert("part name too brief");
    return false;
  }
  // --- inline check select element ---
  if(myForm.worker.value == "") {
    alert("worker name is not selected");
    return false;
  }
  // --- check integer number by function ---
  if(checkInt(myForm.pcs.value) == false) {
    alert("count of pieces must be integer number");
    return false;
  }
  // --- check date number by function ---
  if(checkDate(myForm.term.value) == false) {
    alert("error in term (dd.mm.yyyy)");
    return false;
  }
  // --- additional code (block multiple submit) ---
  return true;
}
</script>

<form method="post" action="xxx.asp" onsubmit="return checkForm(this);">
...
</form>

Important is a way of passing references onto form elements. In code example references are in red color. Reference to form is passed to the central validation function by the help of parameter this in element form. Inside of central validation function references to single form input fields are created as reference to form and by the name of form field. We do not need to use attribute id  for each form element then. Pay attention to script debugging. Bug in script code sometime makes form sending like if form was validated. In IE is such an error hard to catch, I recommend to debug in FF, with error script console opened.

Text validation

While maximum number of characters in input text field is possible to restrict by input element attribute: <input type="text" name="xxx" maxlength="12" />. Minimum, or zero text length have to be tested with help of script as is indicated in the first part of validation script example above.

textarea

Element textarea has no analogy to attribute maxlength. Therefore it is possible to limit text length only by the help of JavaScript. This form element assumes any text, therefore the limitation is against the sense of this element. To prevent jokers who copy extreme long text into textarea, I use length limitation on server.

select validation

As far as select element includes only valid items, there is no need to validate that at all. If the first option of select element is used as title e.g. <option value=""> select name of worker </option>, then validation ought to be executed always (here empty value is error). Do not forget to define attribute value in option element for correct syntax of JavaScript above.

checkbox a radio

When default selection for element radio is kept (by attribute checked="checked"), then some valid item is always selected and no validation is needed. Do not leave radio buttons group without any selected item. This is undefined and non-permissible situation. To test undefined radio buttons status is more difficult, than to select (checked) default radio button in advance. The same is true for checkbox element.

Numbers and date

Validation of more complex data types like decimal number, or date is not quite trivial, because of national setting applied (on client and on server). I pay attention to this problem in separate articles.

User verification

At generating form HTML code on server, user's rights to edit that form are tested at first. Testing of identity and role of active user on server is described in article Single Sign On. According to user verification test, either submit button, or warning message are displayed. There is following benefit. Each user can try on form editing, but can not submit data. In case of job position change, that user is already trained and application administrator only change login name in user table.

Because it is not very difficult to imitate form submit, server script after receiving form data and before update database have to again perform verification of user who submitted the form. Server script should also once again validate whether form data are complete and valid (in case that form was sent without validation). When not authorized access is discovered user is redirected to page with warning on attempt at violation access rights.

Remind of, that such an user rights validation is possible only on intranet, more precisely on the network, where web server and clients are running in same domain and clients have valid accounts in that domain and are regulary logged to that domain. It is impossible to use user validation on Internet.

VBScript

Because I found in log a lot of queries on forms validation by the help of VBScript, I bring in solution, which I used in former times, but now I regard that as evil style. ATTENTION VBScript works only in MSIE. Some functions in VBScript are very attractive thanks to its simplicity. An example is date validation by help of single function IsDate(). Entire validation script can be written in VBScript, or it is possible to call VBScript function from JavaScript as is indicated in following code. Example how never write web application!!!

<script type="text/javascript">
function checkForm(frm) {
  ...
  // --- check date by calling Visual Basic Script function ---
  if(checkDate(frm.term.value) == false) {
    alert("wrong term date format");
    return false;
  }
  return true;
}
</script>

<script type="text/VBscript">
FUNCTION checkDate(ByVal dt)
  checkDate = IsDate(dt)
END FUNCTION
</script>

VBScript function IsDate() tests date and time string, but be care of automatic switching between European and American date format. E.g. date 1.13.2007 is not correct because of there is no 13th month, but after conversion by VBS function Cdate(), date 13.1.2007 is obtained thanks to automatic replacement of days and months. Whether you regard this manners as acceptable, it is up to you.

updated 25.12.2007

home page intranet tour articles, tips