JQuery Form Verification plug-in formValidation for personalized error messages

It is as follows:

Instructions for use
You need to use the jQuery library file and the formValidation library file [download the instance Code]
Http://jquery.com/
At the same time, you need to customize the CSS style for displaying the error message.

Use instance
1. Contains the file section
Copy codeThe Code is as follows:
<Script src = "jquery. js "type =" text/javascript "> </script> <script src =" jquery. validationEngine. js "type =" text/javascript "> </script> <link rel =" stylesheet "href =" validationEngine.jquery.css "type =" text/css "media =" screen "/>

Ii. HTML Section
Copy codeThe Code is as follows:
<Input class = "validate [required, custom [onlyLetter], length [0,100]" name = "firstname" type = "text"/>

The Form Verification Method of the formValidation plug-in is as follows:
Validate [required, custom [onlyLetter], length [0,100] parameter description: required indicates that the form is required, custom [] indicates the verification condition, and length indicates the length

Other descriptions of the formValidation plug-in:
Optional: Special: case where the form value is not empty
Required: required
Length [0,100]: length range
MinCheckbox [7]: Minimum number of check boxes
Confirm [fieldID]: match other fields (for example, confirm password)
Telephone: matching telephone number rules
Email: matching email rules
OnlyNumber: number matching rule
NoSpecialCaracters: Match character rules
OnlyLetter: matching letter rules
Date: Match YYYY-MM-DD format

FormValidation plug-in application instance
1. Verify the ticket token
Copy codeThe Code is as follows:
<Input class = "validate [required] radio" type = "radio" name = "radiogoupe" value = "5"> <input class = "validate [required] radio" type = "radio" name = "radiogoupe" value = "3"/> <input class = "validate [required] radio" type = "radio" name = "radiogoupe" value = "9 "/>

2. Check box for verification
Copy codeThe Code is as follows:
<Input class = "validate [minCheckbox [2] checkbox" type = "checkbox" name = "checkboxgroupe" value = "5"> <input class = "validate [minCheckbox [2] checkbox "type =" checkbox "name =" checkboxgroupe "value =" 3 "/> <input class =" validate [minCheckbox [2] checkbox "type =" checkbox" name = "checkboxgroupe" value = "9"/>

3. Verify the drop-down list 

Copy codeThe Code is as follows:
<Select name = "sport" id = "sport" class = "validate [required]"> <option value = "1"> biuuu_1 </option> <option value = "2 "> biuuu_2 </option> <option value =" 3 "> biuuu_3 </option> <option value =" 4 "> biuu_4 </option> </select>

4. Verify the phone number 
Copy codeThe Code is as follows:
<Input class = "validate [required, custom [telephone] text-input" type = "text" name = "telephone"/>

5. verify email
Copy codeThe Code is as follows:
<Input class = "validate [required, custom [email] text-input" type = "text" name = "email" id = "email"/>

For the above example, it is relatively simple to use the formValidation plug-in to implement form verification, mainly because of its personalized error prompts and custom matching rules, as shown below:

"Telephone": {"regex": "/^ [0-()] + $/", "alertText": "* Invalid phone number"}, where regex indicates matching rules

In this way, alertText can be used to implement custom form error prompt text, which is the same as the method used by the Validation plug-in. It is recommended to use the jQuery Form Verification plug-in formValidation to implement personalized error prompts.
Package and download files