Getting started with jquery validate form verification, jqueryvalidate

Last Update:2016-01-21 Source: Internet

Author: User

Tags api manual

Developer on Alibaba Coud: Build your first app with APIs, SDKs, and tutorials on the Alibaba Cloud. Read more ＞

Getting started with jquery validate form verification, jqueryvalidate

1. jQuery Validate plug-in Introduction

The jQuery Validate plug-in provides powerful form verification functions to simplify form verification on the client side. It also provides a large number of custom options to meet various application needs. This plug-in is bundled with a set of useful verification methods, including URL and email verification, and provides an API for Writing user-defined methods. All bundling methods use English as the error message by default and have been translated into 37 other languages.

This plug-in was compiled and maintained by J örn Zaefferer. He is a member of the jQuery team, the main developer of the jQuery UI team, and the maintenance personnel of QUnit.

Official Website:Http://bassistance.de/jquery-plugins/jquery-plugin-validation/
Online Documentation:Http://docs.jquery.com/Plugins/Validation
Online API:Http://jquery.bassistance.de/api-browser/plugins.html

II. Introduction to features of jQuery Validate

JQuery Validate has the following features:

(1) built-in verification rules;

Powerful jQuery Form Verification plug-in, suitable for daily E-mail, phone number, URL verification and Ajax verification, in addition to its own rich verification rules, you can also add custom verification rules.

Compatible with IE 6 +, Chrome, Firefox, Safari, and Opera 10 +

(2) custom verification rules;

(3) simple and powerful information tips.

(4) Real-time verification: the verification is triggered through the keyup or blur event, not only when the verification is submitted.
Iii. Simple example to learn jQuery Validate

The prerequisites for these examples are to introduce the jQuery library and Validation plug-in.

 <script type="text/javascript" src="../../lib/jquery-1.11.1.js"></script> <script type="text/javascript" src="../../dist/jquery.validate.js"></script>

1. Use plug-ins for some simple verification

<Html> 
The effect is as follows:

The above verification explanation:
1), first need to introduce the jquery-1.11.1.js, because this plug-in is based on JQuery.
2) introduce the validation plug-in jquery. validate. js.
3) introduce the prompt localization script. The verification information is internationalized. By default, the verification prompt is in English. You can import the international file that has been written by validation to internationalize it. Change the error/correct message display style.
4) Add the type to be verified in the class attribute of the input box. Verify the encoding rules for different fields and set the corresponding attributes of the fields.
Some verifiable rule types are as follows:

(1) required: true mandatory field (2) remote: "check.shtml" use ajax to call check.shtml to verify the input value (3) email: true must enter an email in the correct format (only the format can be verified, validity is not guaranteed) (4) url: true must enter the url in the correct format (5) date: true must enter the date in the correct format (6) dateISO: true: Enter the date (ISO) in the correct format. For example, 2009-06-23,1998/01/22 only verifies the format and does not validate the validity (7) number: true: a valid number (negative, decimal) (8) digits: true: an integer (9) creditcard: a valid credit card number (10) must be entered: "# field" must be the same as # field (11) accept: enter a string with a valid suffix (the suffix of the uploaded file) (12) maxlength: 5 string with a maximum input length of 5 (one character for Chinese characters) (13) minlength: 10 string with a minimum input length of 10 (one character for Chinese characters) (14) rangelength: [5, 10] The input length must be a string between 5 and 10 ") (one character for Chinese characters) (15) range: [5, 10] The input value must be between 5 and 10 (16) max: 5 input values cannot be greater than 5 (17) min: 10 input values cannot be less than 10
5) determine the form to be verified

<script type="text/javascript">////<![CDATA[$(document).ready(function(){ $("#commentForm").validate();});//]]></script>
The above is an introduction to jquery validate form verification. I hope it will be helpful to you.
Articles you may be interested in:

 
 
  Getting started with jquery validate. js Form Verification
 
  Jquery. validate Introduction Part 3
 
  Step 4 of jquery validate Introduction
 
  Jquery. validate Step 5 Regular Expression Verification
 
  JQuery validate Chinese API attached validate. js Chinese api Manual
 
  JQuery extension Validate-4: Set the error message Style
 
  Validation of JQuery extension Validate-6 radio, checkbox, and select
 
  JQuery EasyUI API Chinese Document-ValidateBox verification box
 
  Usage of jQuery. Validate verification Library
 
  Form Verification Based on Bootstrap + jQuery. validate

This article is an English version of an article which is originally in the Chinese language on aliyun.com and is provided for information purposes only. This website makes no representation or warranty of any kind, either expressed or implied, as to the accuracy, completeness ownership or reliability of the article or any translations thereof. If you have any concerns or complaints relating to the article, please send an email, providing a detailed description of the concern or complaint, to info-contact@alibabacloud.com. A staff member will contact you within 5 working days. Once verified, infringing content will be removed immediately.

A Free Trial That Lets You Build Big!

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

Get Started for Free

Sales Support

1 on 1 presale consultation

Chat Contact Sales
After-Sales Support

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

Open a Ticket
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

Learn More