Javascript Form Validation

I got a JS script that I based this on a long time ago, I don't really remember from where so I cannot give the appropiate credit, I have changed along the way and added a few things like the date validation and formatting, hopefully it is usefull for some of you out there, I personally use it in most of the applications I build.

Basically, the idea of the script is to print error messages next to the fields to guide the users, so if you submit the form without all the mandatory fields, it will display red messages next to each field etc.

You can get the JS file Here, and the HTML code Here

To implement it, simply add an empty DIV next to the fields, I use a the naming convention <Field Name>_inf to avoid any confusions, but you can change it.

Then there is a function called validateOnSubmit that is called, like the name suggests, upon submitting the form, most of the validation functions recieve 3 parameters (Field, div_name, boolean) the first parameter, is pretty much the field you want to validate i.e. document.forms["form name"].field_name, the second is the id of the empty div you added next to the field, and the third indicates whether the field is mandatory or not (true/false).

So with this in mind, you get the following script:

function validateOnSubmit()
{
var elem;
var errs=0;
var l_form = document.forms["sample_form"];
if (!validatePresent (l_form.p_text, "inf_p_text")) errs += 1;
if (!validateEmail (l_form.p_email, "inf_p_email", true)) errs += 1;
if (!validateEmail (l_form.p_email2, "inf_p_email2", false)) errs += 1;
if (!validatePresent (l_form.p_dropdown, "inf_p_dropdown")) errs += 1;
if (!validateNumber (l_form.p_number, "inf_p_number", false)) errs += 1;
if (!validateDollar (l_form.p_dollar, "inf_p_dollar", false)) errs += 1;
if (!validatePostCode (l_form.p_pcode, "inf_p_pcode", false)) errs += 1;
if (!validateLenght (l_form.p_comments, "inf_p_comments", true)) errs += 1;
if (!validateName (l_form.p_name, "inf_p_name", false)) errs += 1;
if (!validateDate (l_form.p_date, "inf_p_date", true)) errs += 1;
if (!validateDate (l_form.p_date2, "inf_p_date2", false)) errs += 1;

if (errs>1) alert("There are fields which need correction before sending");
if (errs==1) alert("There is a field which needs correction before sending");
if (errs==0)
{
return true;
}
return false;
}

For each field I added the DIV as follows:

<input type="text" name="p_email2" size="60">
<div id="inf_p_email2" style="display:none"> </div>

General Javascript Validation

General Fields
Mandatory Text:
Mandatory Email Address:
Non Mandatory Email Address:
Manadatory Drop-Down:	Option 1 Option 2 Option 3 Option 4
Number:
Other Fields
Post Code:
Dollar Amount: (99.99)
No Spaces or Special Chars:
Text Max Lenght (100):
Date Fields
Mandatory Date:	(DD/MM/YYYY), also if other format enter automatically convert(i.e. '12 jan 09')
Non Mandatory Date:	(DD/MM/YYYY), also if other format enter automatically convert(i.e. '12 jan 09')