How to use Form Validation in JavaScript?

[Dilbert]

I have just started with the JavaScript. I have done some basic program in the JavaScript. But now I want to use the validations for the form.!! Since I am new I don't have any idea to use the validations. Can somebody explain me how to use Form Validation in JavaScript? Also tell me the different types of the Validation that are used in the form.!! The sample of the coding will be much appreciable..!!

[MindSpace]

For validating data in HTML forms, JavaScript can be used before sending off the content to a server. The basic premise of creating form validation is to look for the names of form elements that are required, and if they are empty, display an error message. The validation script offers a collection of validation functions, and an easy way to use them in your form with JavaScript. Each data validation function returns an array of valid inputs that were detected, and has the ability to filter and reformat data to desired appearances and standards. If no valid input is detected, then an error code is returned.

[Modifier]

You should know more about the programming interface of the JavaScript validation. The JavaScript validation programming interface consists of four components which are described below :

• Validation functions for each type of data.
• Validation handler used for onsubmit. This validation supports generic form using a list of form elements by using a validation profile customized for your form.
• Low-level processing functions for numerical values, text, and whitespace.
• Definitions of error codes and user-friendly error code messages.

[Warner]

For using the validation in the form, the important thing is to check the required fields. The function below checks if a required field has been left empty. And the code is given below :

function validate_required(field,alerttxt)
{
with (field)
  {
  if (value==null||value=="")
    {
    alert(alerttxt);return false;
    }
  else
    {
    return true;
    }
  }
}

An alert box alerts a message and the function returns false, if the required field is blank. If a value is entered, the function returns true which means that data is OK.

[Viensterrr]

I am giving you the code that can be used in HTML. The example that I have mentioned below is somewhat complicated to show you the power of form validation. Here is the coding for same :

<form name="a"> 
	 
	  <fieldset> 
	  <legend><b>Fill in current address.</b></legend> 
	 
	  <dl> 
	    <dt><label id="fname" for="n1">First name</label> and <label id="lname" for="n2">Last name</label></dt> 
	      <dd><input type="text" name="name" id="n1"> 
	      <input type="text" name="lastname" id="n2"></dd> 
	    <dt><label id="ladd" for="address">Address</label></dt> 
	    <dd><input type="text" name="address" size="55" 
	      onfocus="highLabel('a1', '#ccf')" onblur="highLabel('a1', '')"></dd> 
	    <dt><label id="lcity">Place</label>, <label id="lstate">State (two-letter abbreviation)</label>, and <label id="lzip">Zip</label></dt> 
	      <dd><input type="text" name="city">, 
	      <input type="text" name="state" size="4" maxlength="2"> 
	      <input type="text" name="zip" size="12" maxlength="10"></dd> 
	    <dt><label id="lphone">Phone (area code and number)</label> and <label id="lemail">Email</label></dt> 
	      <dd><input type="text" name="phone" size="18"> 
	      <input type="text" name="email" size="35"></dd> 
	  </dl> 
	 
	  <p><input type="button" onclick=" validate(this.form, billing_address_check) 
	  &amp;&amp; alert('All required fields are OK!')" value="Validate the Billing Address"></p> 
	  </fieldset> 
	 
	</form>