Easyui The validation box inside the form forms to explain the next Validatebox class and related properties.
Validation rules
Validation rules are defined by using the required and Validtype attributes, and here are the rules that have been implemented:
Email: matching email regular expression rules, system-provided properties.
URLs: matching URL Regular expression rules
LENGTH[0,100]: Allow from X to Y characters
remote[' http://.../action.do ', ' paramname ']: sends an AJAX request to validate the value and returns ' true ' when it succeeds.
To customize the validation rules, rewrite $.fn.validatebox.defaults.rules to define a validation function and invalid information. For example, define a minlength authentication type:
$.extend ($.fn.validatebox.defaults.rules, {
minlength: {
validator:function (value, param) {
return Value.length >= param[0];
}, message
: ' Please enter at least {0} characters. '
}
Call the Validate method and return the validation result, true or false.
<div id= "Userreg" class= "Easyui-panel" style= "width:400px"; height:300px "title=" Registered user > <form action= "" method= "post" > <table> <tr> <td> user name: </TD&G
T <td><input type= "text" name= "username" class= "easyui-validatebox" Required=true validtype= "midLength[4,10] "Value=" "/></td> </tr> <tr> <td> password:</td> <td><input type=" text "Name=" pass Word "class=" Easyui-validatebox "required=true validtype=" pwdlength[8 "value=" "/></td> </tr> <tr > <td> Gender:</td> <td> <input type= "Radio" name= "Sex" checked= "checked" value= "male"/> Male <in Put type= "Radio" name= "Sex" value= "female"/> Women </td> </tr> <tr> <td> age:</td> <TD&G T;<input type= "text" name= "Age" value= ""/></td> </tr> <tr> <td> Birth date:</td> <td& Gt;<input type= "text" name= "Birth" value= ""/></td> </tr> <tr> <td>:</td> <td><input type= "text" name= "City" value= ""/></td> </tr> <tr> &L
t;td> salary:</td> <td><input type= "text" name= "salary" value= ""/></td> </tr> <tr> <TD colspan= "2" > <a class= "Easyui-linkbutton" > Save </a> </td> </tr> </table> </fo rm> </div> <script type= "Text/javascript" > $ (function () {$.extend ($.fn.validatebox.defaults.rules,{m
idlength:{validator:function (value, param) {return value.length >= param[0] && value.length<=param[1];
Message: ' username must be between 4 and 10 digits! '
}, pwdlength:{validator:function (value,param) {return value.length==param[0];
Message: ' Password must be 8-bit '}};
}); </script>
The reference picture is as follows: