Check Form Validation - Tested in IE 7.0, Netscape 8.1.3, Opera 9.21, Firefox 2.0.0.4 and AOL Explorer 1.5

For your Information: Before we begin, we feel obligated to advise you that the above form is for all intensive purposes a "Stand Alone" script. In other words, it really does not do much of anything other than what you see. In order to make it function as designed, you need to incorporate it into a valid working form. If you do not have a good Solid Knowledge of HTML coding, javascripts, forms and reconfigurations, please "Do Not Attempt" this until you are Proficient in the aforementioned areas.

Depending on your knowledge of HTML and javascripts, this is a two (2) part copy and paste code that goes in both the <HEAD> section and <BODY> section (incorporated into a working form) of your document.

There are some reconfigurations that can be made within the <HEAD> section. The only one to us that is possibly relevant is that of the year itself in the (dd/mm/yyyy). The way it is set now, it will not validate (add a ) to a year prior to 1900. To change that, see below where and howto.

var Condition=new Array(
'a!=""', //Must be filled
'a!=""', //Must be filled
'a!=""&&a.length>5&&a.indexOf("@")!=-1&&a.indexOf(".")!=-1', //Must be longer than 5 characters, have @, and atleast one '.'
'a.length>7&&!(a.split("/")[0]*1>12)&&!(a.split("/")[1]*1>31)&&!(a.split("/")[2]*1<1900)' //Must be longer than 7 characters, first (two) digit(s) NOT greater than 12, second (two) digit(s) NOT greater than 31 and last 4 greater than 1900
);
function docheck(w) {

As you can notice in the code to the left the one (1) color coded section. This denotes from what year forward the script will validate the year. To change the validation year, change that number to the earliest year you want to start the validation.
In our example we reconfigured the validation to start in the year 1800.

Little Extra Not Included In The Script: You can limit the number of characters in each input field, set the size for each etc. These configurations are made in the <BODY> section of code. See below where and howto.

<form name=form>
<input type=checkbox name=check0 onClick="return false"> First: <input type=text name=text0 onBlur='docheck("0")'><BR>

<input type=checkbox name=check1 onClick="return false"> Last: <input type=text name=text1 onBlur='docheck("1")'><BR>

<input type=checkbox name=check2 onClick="return false"> E-Mail: <input type=text name=text2 onBlur='docheck("2")'><BR>

<input type=checkbox name=check3 onClick="return false"> Birthday (mm/dd/yyyy): <input type=text name=text3 onBlur='docheck("3")'><BR>
</form>

For Your Information: As you can notice in the default section (leftside) of the above, none of the input forms are defined with limits of any sort. Now look at the Reconfigured section (Rightside) and see where and how we defined limits on the input boxes. In our example we have defined only the input filed that references the Date of Birth. We set the size (length) of the box and the number of characters allowed. So, in actuality, all we did was to add the below attributes into the input field.

Define Below Attributes

size=10 This denotes how long from side to side the input box is. If you do not add this attribute, you will have the default size as you see in our example and below.

maxlength=10 This denotes how many characters will be allowed in the input box.

We hope our tutorial was easy to follow and we covered everything in detail. If you would like to add this effect into your pages, grab the respective below link and you are there. If you have any problems with this or anything else, feel free to consult our [ FAQ ] and if you can't find the answer there, [ contact us ].
[ Get Code Here ] [ Rate This Page ]