A complete Web form verification program

<Title> Form Verification type: validator V1.0 </title>

<Style>

Body, TD {Font: normal 12px verdana; color: #333333}

Input, textarea, select, TD {Font: normal 12px verdana; color: #333333; Border: 1px solid
#999999; Background: # ffffff}

Table {border-collapse: collapse ;}

TD {padding: 3px}

Input {Height: 20 ;}

Textarea {width: 80%; Height: 50px; overflow: auto ;}

FORM {display: inline}

</Style>

<Table align = "center">

<Form name = "theform" id = "Demo" Action = "" method = "get"
Onsubmit = "Return validator. Validate (this, 2)">

<Tr>

<TD> real name: </TD> <input name = "name" datatype = "Chinese"
MSG = "real names only allow Chinese"> </TD>

</Tr>

<Tr>

<TD> English name: </TD> <input name = "Nick" datatype = "English"
Require = "false" MSG = "English names only allow English letters"> </TD>

</Tr>

<Tr>

<TD> Home Page: </TD> <input name = "Homepage" require = "false"
Datatype = "url" MSG = "invalid URL"> </TD>

</Tr>

<Tr>

<TD> password: </TD> <input name = "password" datatype = "safestring"
MSG = "the password does not comply with security rules" type = "password"> </TD>

</Tr>

<Tr>

<TD> duplicate: </TD> <input name = "repeat" datatype = "repeat"
To = "password" MSG = "the two passwords are inconsistent." type = "password"> </TD>

</Tr>

<Tr>

<TD> mailbox: </TD> <input name = "email" datatype = "email"
MSG = "Incorrect mailbox format"> </TD>

</Tr>

<Tr>

<TD> mailbox: </TD> <input name = "email" datatype = "repeat"
To = "email" MSG = "two input mailboxes are inconsistent"> </TD>

</Tr>

<Tr>

<TD> QQ: </TD> <input name = "QQ" require = "false"
Datatype = "QQ" MSG = "QQ number does not exist"> </TD>

</Tr>

<Tr>

<TD> ID card: </TD> <input name = "card" datatype = "idcard"
MSG = "Incorrect ID card number"> </TD>

</Tr>

<Tr>

<TD> Age: </TD> <input name = "year" datatype = "range"
MSG = "the age must be 18 ~ Between 28 "min =" 18 "max =" 28 "> </TD>

</Tr>

<Tr>

<TD> age 1: </TD> <input name = "year1" require = "false"
Datatype = "Compare" MSG = "must be above 18" to = "18" operator = "greaterthanequal"> </TD>

</Tr>

<Tr>

<TD> Phone: </TD> <input name = "phone" require = "false"
Datatype = "phone" MSG = "Incorrect phone number"> </TD>

</Tr>

<Tr>

<TD> mobile phone: </TD> <input name = "mobile" require = "false"
Datatype = "mobile" MSG = "Incorrect mobile phone number"> </TD>

</Tr>

<Tr>

<TD> birthday: </TD> <input name = "Birthday" datatype = "date"
Format = "ymd" MSG = "birthday date does not exist"> </TD>

</Tr>

<Tr>

<TD> zip code: </TD> <input name = "Zip" datatype = "Custom"
Regexp = "^ [1-9] \ D {5} $" MSG = "zip code does not exist"> </TD>

</Tr>

<Tr>

<TD> zip code: </TD> <input name = "zip1" datatype = "Zip"
MSG = "zip code does not exist"> </TD>

</Tr>

<Tr>

<TD> Operating System: </TD> <select name = "operation" datatype = "require"
MSG = "OS not selected"> <option value = ""> select your OS </option> <Option
Value = "Win98"> Win98 </option> <option value = "Win2k"> Win2k </option> <Option
Value = "WINXP"> WINXP </option> </SELECT> </TD>

</Tr>

<Tr>

<TD> Province: </TD> <TD> Guangdong <input name = "Province" value = "1"
Type = "radio"> Shaanxi <input name = "Province" value = "2"
Type = "radio"> Zhejiang <input name = "Province" value = "3"
Type = "radio"> Jiangxi <input name = "Province" value = "4"
Type = "radio" datatype = "group" MSG = "A province must be selected"> </TD>

</Tr>

<Tr>

<TD> Hobbies: </TD> <TD> sports <input name = "favorite" value = "1"
Type = "checkbox"> surfing the Internet <input name = "favorite" value = "2"
Type = "checkbox"> listen to music <input name = "favorite" value = "3"
Type = "checkbox"> reading <input name = "favorite" value = "4"
Type = "checkbox" "datatype =" group "min =" 2 "max =" 3"
MSG = "must select 2 ~ 3 hobbies "> </TD>

</Tr>

<TD> self-introduction: </TD> <textarea name = "Description"
Datatype = "Limit" max = "10" MSG = "self-introduction content must be within 10 words"> Chinese is a word </textarea> </TD>

</Tr>

<TD> autobiography: </TD> <textarea name = "History" datatype = "limitb"
Min = "3" max = "10" MSG = "the autobiography content must be within [3, 10] bytes"> Chinese is two bytes T </textarea> </TD>

</Tr>

<Tr>

<TD colspan = "2"> <input name = "Submit" type = "Submit"
Value = "Confirm submission"> <input onclick = "validator. Validate (document. getelementbyid ('Demo '))"
Value = "Test Mode 1" type = "button"> <input onclick = "validator. Validate (document. getelementbyid ('Demo'), 2 )"
Value = "Test Mode 2" type = "button"> <input onclick = "validator. Validate (document. getelementbyid ('Demo'), 3 )"
Value = "Test Mode 3" type = "button"> </TD>

</Tr>

</Form>

</Table>

<SCRIPT>

/*************************************** **********

Validator V1.0

Cody by my Buddha Mountain

Wfsr@cunite.com

Http://www.cunite.com

**************************************** *********/

Validator = {

Require:/. + /,

Email:/^ \ W + ([-+.] \ W +) * @ \ W + ([-.] \ W + )*\. \ W + ([-.] \ W +) * $ /,

Phone:/^ (\ D {3} \) | (\ D {3 }\-))? (\ (0 \ D {2, 3} \) | 0 \ D {2, 3 }-)? [1-9] \ D {6, 7} $ /,

Mobile:/^ (\ D {3} \) | (\ D {3 }\-))? 13 \ D {9} $ /,

URL:/^ http: \/[A-Za-z0-9] + \. [A-Za-z0-9] + [\/= \? % \-&_~ '@ [\] \': +!] * ([^ <> \ "\"]) * $ /,

Idcard:/^ \ D {15} (\ D {2} [A-Za-z0-9])? $ /,

Currency:/^ \ D + (\. \ D + )? $ /,

Number:/^ \ D + $ /,

ZIP:/^ [1-9] \ D {5} $ /,

QQ:/^ [1-9] \ D {4, 8} $ /,

Integer:/^ [-\ +]? \ D + $ /,

Double:/^ [-\ +]? \ D + (\. \ D + )? $ /,

English:/^ [A-Za-Z] + $ /,

Chinese:/^ [\ u0391-\ uffe5] + $ /,

Unsafe:/^ ([A-Z] * | [A-Z] * | \ D * | [-_\~! @ # \ $ % \ ^ & \ * \. \ (\) \ [\] \ {\} <> \? \/\ '\ "] *) |. {0, 5}) $ | \ s /,

Issafe: function (STR) {return! This. Unsafe. Test (STR );},

Safestring: "This. issafe (value )",

Limit: "This. Limit (value. length, getattribute ('Min'), getattribute ('max '))",

Limitb: "This. Limit (this. lenb (value), getattribute ('Min'), getattribute ('max '))",

Date: "This. isdate (value, getattribute ('Min'), getattribute ('format '))",

Repeat: "value = Document. getelementsbyname (getattribute ('to') [0]. Value ",

Range: "getattribute ('Min') <Value & value <getattribute ('max ')",

Compare: "This. Compare (value, getattribute ('operator'), getattribute ('to '))",

Custom: "This. Exec (value, getattribute ('regexp '))",

GROUP: "This. mustchecked (getattribute ('name'), getattribute ('Min'), getattribute ('max '))",

Erroritem: [document. Forms [0],

Errormessage: ["failed submission due to the following reasons: \ t"],

Validate: function (theform, mode ){

VaR OBJ = theform | event. srcelement;

VaR COUNT = obj. elements. length;

This. errormessage. Length = 1;

This. erroritem. Length = 1;

This. erroritem [0] = OBJ;

For (VAR I = 0; I <count; I ++ ){

With (obj. elements [I]) {

VaR _ datatype = getattribute ("datatype ");

If (typeof (_ datatype) = "object" | typeof (this [_ datatype]) = "undefined ")
Continue;

This. clearstate (obj. elements [I]);

If (getattribute ("require") = "false" & value =
"") Continue;

Switch (_ datatype ){

Case "date ":

Case "repeat ":

Case "range ":

Case "Compare ":

Case "Custom ":

Case "group ":

Case "Limit ":

Case "limitb ":

Case "safestring ":

If (! Eval (this [_ datatype]) {

This. adderror (I, getattribute ("MSG "));

}

Break;

Default:

If (! This [_ datatype]. Test (value )){

This. adderror (I, getattribute ("MSG "));

}

Break;

}

}

}

If (this. errormessage. length> 1 ){

Mode = mode | 1;

VaR errcount = This. erroritem. length;

Switch (mode ){

Case 2:

For (VAR I = 1; I <errcount; I ++)

This. erroritem [I]. style. color = "red ";

Case 1:

Alert (this. errormessage. Join ("\ n "));

This. erroritem [1]. Focus ();

Break;

Case 3:

For (VAR I = 1; I <errcount; I ++ ){

Try {

VaR span = Document. createelement ("span ");

Span. ID = "_ errormessagepanel ";

Span. style. color = "red ";

This. erroritem [I]. parentnode. appendchild (SPAN );

Span. innerhtml = This. errormessage [I]. Replace (/\ D + :/,"*");

}

Catch (e) {alert (E. Description );}

}

This. erroritem [1]. Focus ();

Break;

Default:

Alert (this. errormessage. Join ("\ n "));

Break;

}

Return false;

}

Return true;

},

Limit: function (Len, Min, max ){

Min = min | 0;

Max = max | number. max_value;

Return min <= Len & Len <= max;

},

Lenb: function (STR ){

Return Str. Replace (/[^ \ x00-\ xFF]/g, "**"). length;

},

Clearstate: function (ELEM ){

With (ELEM ){

If (style. Color = "red ")

Style. color = "";

VaR lastnode = parentnode. childnodes [parentnode. childnodes. Length-1];

If (lastnode. ID = "_ errormessagepanel ")

Parentnode. removechild (lastnode );

}

},

Adderror: function (index, STR ){

This. erroritem [This. erroritem. Length] = This. erroritem [0]. elements [Index];

This. errormessage [This. errormessage. Length] = This. errormessage. Length + ":"
+ STR;

},

Exec: function (OP, Reg ){

Return new Regexp (Reg, "G"). Test (OP );

},

Compare: function (OP1, operator, OP2 ){

Switch (operator ){

Case "notequal ":

Return (OP1! = OP2 );

Case "greaterthan ":

Return (OP1> OP2 );

Case "greaterthanequal ":

Return (OP1> = OP2 );

Case "lessthan ":

Return (OP1 <OP2 );

Case "lessthanequal ":

Return (OP1 <= OP2 );

Default:

Return (OP1 = OP2 );

}

},

Mustchecked: function (name, Min, max ){

VaR groups = Document. getelementsbyname (name );

VaR haschecked = 0;

Min = min | 1;

Max = max | groups. length;

For (VAR I = groups. Length-1; I> = 0; I --)

If (groups [I]. Checked) haschecked ++;

Return min <= haschecked & haschecked <= max;

},

Isdate: function (OP, formatstring ){

Formatstring = formatstring | "ymd ";

VaR M, year, month, day;

Switch (formatstring ){

Case "ymd ":

M = op. match (New Regexp ("^ \ s * (\ D {4}) | (\ D {2 }))([-. /]) (\ D {1, 2}) \ 4 (\ D {1, 2}) \ s * $ "));

If (M = NULL) return false;

Day = m [6];

Month = m [5] --;

Year = (M [2]. Length = 4 )? M [2]: getfullyear (parseint (M [3], 10 ));

Break;

Case "DMY ":

M = op. match (New Regexp ("^ \ s * (\ D {1, 2 })([-. /]) (\ D {1, 2}) \ 2 (\ D {4}) | (\ D {2 })) \ s * $ "));

If (M = NULL) return false;

Day = m [1];

Month = m [3] --;

Year = (M [5]. Length = 4 )? M [5]: getfullyear (parseint (M [6], 10 ));

Break;

Default:

Break;

}

VaR date = new date (year, month, day );

Return (typeof (date) = "object" & year = date. getfullyear ()
& Month = date. getmonth () & day = date. getdate ());

Function getfullyear (y) {return (Y <30? "20": "19") +
Y) | 0 ;}

}

}

</SCRIPT>