Form Verification is the most common in daily projects. Using a good JS library can help us get twice the result with half the effort. Jquery. Validate is undoubtedly a good choice.
Jquery. validate. This verification library is a jquery plug-in written by bassistance.de. bassistance.de also provides many other jquery plug-ins. I will not describe them here, you can go to the official website to check whether it is good.
The following provides jquery. Validate:
Http://bassistance.de/jquery-plugins/jquery-plugin-validation/
Here are detailed descriptions and documents.
Not much nonsense.
To use jquery. Validate, we must first reference jquery on the page, and then reference the downloaded jquery. Validate. js file. If you need to prompt for verification that the message uses the default Chinese characters, you also need to reference the messages_cn.js file.
After the file is introduced, we need to start encoding, jquery. validate is used to monitor form. Before any form submission operation, jquery. validate checks whether the input items in the form meet the rules before submission is allowed. Therefore, the registration code for form verification during jquery (document). Ready () is as follows:
1 <script type="text/javascript"> 2 jQuery(document).ready(function() { 3 jQuery("#<%=form1.ClientID %>").validate(); 4 }); 5 </script>
Next we will set rules for the form elements:
The format is rules: {name of the form element: {rule }}
Custom error message is set through messages:
The format is messages: {name of the form element in rules: {corresponding rule name: Display message }}
A simple example is as follows:
<HTML xmlns = "http://www.w3.org/1999/xhtml">
The above demonstrates the basic verification settings. In addition, we also need remote verification.
For this reason, we have improved the above instance and added remote verification in the Name field:
1 name: { 2 required: true, 3 remote: { 4 url: "remote.ashx", 5 type: "post", 6 data: { 7 name: function () { 8 return $("#name").val(); 9 }10 },11 dataType: "html",12 dataFilter: function (data) {13 data = data.toLowerCase()14 if (data == "true") {15 return true;16 }17 else {18 return false;19 }20 }21 }
In this case, we need to cooperate on the server side. Here we take Asp.net as an example to demonstrate:
Create an ashx, a general processing program,
1 public void ProcessRequest(HttpContext context) 2 { 3 context.Response.ContentType = "text/html"; 4 string name = context.Request["name"]; 5 if (!string.IsNullOrWhiteSpace(name)) 6 { 7 if (name.Trim() == "wang") 8 context.Response.Write(true); 9 }10 11 }
Since then, our remote verification has been completed.
This is just a basic introduction. You can refer to the downloaded document or demos for more information.
If anything is wrong, please make a brick.
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
