jquery plugin, form validation validation plugin use

Source: Internet
Author: User

Notes:

First, the introduction of plug-ins

<script type= "Text/javascript" src= "js/jquery-1.10.0.js" ></script><script type= "Text/javascript" Src= "Js/jquery.validate-1.13.1.js" ></script>

Sample: A simple sign-in form verification

1             <formID= "LoginForm">2             <label for= "UserName">User name:</label>3             <inputtype= "text"ID= "User"name= "UserName" />4             <BR/><BR/>5             <label for= "PassWord">Password:</label>6             <inputtype= "Password"ID= "PassWord"name= "PassWord" />7             <BR/><BR/>8             <label for= "PassWord">Submit:</label>9             <inputtype= "Submit"ID= "Submit"name= "Submit" />Ten         </form>
1$ (document). Ready (function(){2$ ("#loginForm"). Validate ({3rules:{//Defining Rules4 username:{5Requiredtrue,//must fill in6Minlength:3,//Minimum7Maxlength:20//Maximum8                         },9 password:{TenRequiredtrue, OneMinlength:6, AMaxlength:16 -                         } -                     }, the                     //Design for Chinese tips -messages:{//defining the Prompt information - username:{ -Required: "User name must be filled in",//must fill in +MinLength: "User name Min. 3 Bits",//Minimum -MaxLength: "User name Max 20-bit"//Maximum +                         }, A password:{ atRequired: "Must fill in password",//must fill in -MinLength: "Password minimum 6 bit",//Minimum -MaxLength: "Password maximum 16 bit"//Maximum -                         } -                     } -                 }); in});

Alidate's API

Api:
$ (document). Ready (function(){ //Validate is the core approach to plug-ins, defining basic validation rules and some swimming configuration items$ ("#loginForm"). Validate ({debug:true,//true to indicate that the form will not be submitted and only checkedremote:{//remote checksum, remote.php as the address of the dataURL "Remote.json", type:"POST", data:{logintime:function(){ return+NewDate;//convert a character to a number}}}, rules:{//Defining Rulesusername:{Required:true,//must fill inMinlength:3,//MinimumMAXLENGTH:20,//Maximummin:,2//Minimum ValueMAX:20,//Maximum ValueRANGE:[2,20],//Value RangeEmailtrue,//email format, true must be e-mail formatUrl:true,//URL FormatDatetrue,//DateDateiso:true,//ISO dateNumbertrue,//DigitalDigitstrue,//integerEqualto: "#password",//equal to the value of another element, #password the value of the selectorMinlength:3,//MinimumMAXLENGTH:20,//MaximumRANGELENGTH:[3,20],//Length Range}, password:{required:true, minlength:6, MaxLength:16 } }, //Design for Chinese tipsmessages:{//defining the Prompt informationusername:{Required:"User name must be filled in",//must fill inMinLength: "User name Min. 3 Bits",//MinimumMaxLength: "User name Max 20-bit",//MaximumRemote: "User name does not exist"}, password:{required:"Must fill in the password",//must fill inMinLength: "Password minimum 6 bit",//MinimumMaxLength: "Password maximum 16 bit"//Maximum } } }); Valid ()//check whether the form or some elements are validRules ("Add", rules)//Add a validation rule to a FORM elementRules ("Remove", rules)//Delete Form element validation rules //Alidator ObjectThe Alidate method returns the Alidator object, Alidator object has many useful methods, as follows: Alidator.form ()//Verify that the form is valid and return True/falseAlidator.element (Element)//verifies that an element is valid, returns True/falseAlidator.resetform ()//restore the form to its original state before verificationAlidator.showerrors (Errors)//a specific error message is being displayed for an elementAlidator.numberofinvalids ()//returns the number of invalid elementsValidator Object static method: Jquery.validator.addMethod (Name,method [, message])//Add a custom validation methodJquery.validator.format (Template,argument,argumentn ...)//format the string with parameters instead of {n} in the templateJquery.validator.setDefaults (Options)//Modify plug-in default settingsJquery.validator.addClassRules (Name,rules)//Add a combination validation type for some class that contains the nameValidate ()//Method Configuration ItemsSubmithandler//You can add a form submission method by using a function that runs after validationInvalidhandler//functions that are not valid after a form is submitted, two parameters event and validatorIgnore//No validation of certain elementsRules//defining a validation ruleMessages//Pass definition prompt informationGroups//validation of a set of elements, with an error prompt, using Errorplacement to control where the error message is placedsuch as: SUBMITHANDLR:function(form) {$ajax ({}); }

jquery plugin, form validation validation plugin use

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.