A very powerful complete Web Form verifier (JavaScript) __web

Source: Internet
Author: User
Validator Complete code:


<title> form Verification Class 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><td><input name= "name" datatype= "Chinese"
msg= "real name only allowed in Chinese" ></td>

</tr>

<tr>

<td> English Name: </td><td><input name= "Nick" datatype= "中文版"
Require= "false" msg= "English name only allowed English alphabet" ></td>

</tr>

<tr>

<td> Home: </td><td><input name= "homepage" require= "false"
Datatype= "url" msg= "Illegal url" ></td>

</tr>

<tr>

<td> Password: </td><td><input name= "Password" datatype= "safestring"
msg= "Password does not conform to security rules" type= "password" ></td>

</tr>

<tr>

<td> repeat: </td><td><input name= "Repeat" datatype= "Repeat"
To= "Password" msg= "Two input passwords inconsistent" type= "Password" ></td>

</tr>

<tr>

<td> Mail: </td><td><input name= "email" datatype= "email"
msg= "Mailbox format not correct" ></td>

</tr>

<tr>

<td> Mail: </td><td><input name= "Email" datatype= "Repeat"
to= "Email" msg= "two-input mailbox inconsistency" ></td>

</tr>

<tr>

<td>qq:</td><td><input name= "QQ" require= "false"
Datatype= "QQ" msg= "QQ number does not exist" ></td>

</tr>

<tr>

<td> ID: </td><td><input name= "card" datatype= "Idcard"
msg= "wrong ID number" ></td>

</tr>

<tr>

<td> Age: </td><td><input name= "Year" datatype= "Range"
Msg= "Age must be between 18~28" min= "max=" ></td>

</tr>

<tr>

<td> age 1:</td><td><input name= "Year1" require= "false"
Datatype= "Compare" msg= age must be above 18 "to=" operator= "Greaterthanequal" ></td>

</tr>

<tr>

<td> Tel: </td><td><input name= "Phone" require= "false"
Datatype= "Phone" msg= "wrong Number" ></td>

</tr>

<tr>

<td> Mobile: </td><td><input name= "mobile" require= "false"
Datatype= "mobile" msg= "cell phone number is incorrect" ></td>

</tr>

<tr>

<td> Birthday: </td><td><input name= "Birthday" datatype= "Date"
format= "Ymd" msg= "Birthday date does not exist" ></td>

</tr>

<tr>

<td> zip Code: </td><td><input name= "Zip" datatype= "Custom"
regexp= "^[1-9]/d{5}$" msg= "ZIP code does not exist" ></td>

</tr>

<tr>

<td> Postal Code: </td><td><input name= "Zip1" datatype= "Zip"
msg= "ZIP code does not exist" ></td>

</tr>

<tr>

<td> operating system: </td><td><select name= "Operation" datatype= "Require"
Msg= "Not selected operating system" ><option value= "> select the operating system you are using </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= "must select a province" ></td>

</tr>

<tr>

<td> Hobby:</td><td> Sports <input name= "favorite" value= "1"
type= "checkbox" > Internet <input name= "favorite" value= "2"
type= "checkbox" > Listening 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 choose 2~3 kind of hobby" ></td>

</tr>

<td> Self Introduction: </td><td><textarea name= "Description"
Datatype= "Limit" max= "msg=" Self introduction content must be within 10 words "> Chinese is a word </textarea></td>

</tr>

<td> autobiography: </td><td><textarea name= "History" datatype= "LIMITB"
Min= "3" max= "msg=" autobiographical content must be within [3,10] bytes "> Chinese is two bytes t</textarea></td>

</tr>

<tr>

&LT;TD colspan= "2" ><input name= "Submit" type= "Submit"
Value= "OK submit" ><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 me Foshan people

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+)? $/,

中文版:/^[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: [The following causes failed to commit:/t/t/t/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) |

}

}

</script>
Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.