Recently the company's projects are used in the jquery validate in the form, feel really very useful, very flexible, very handy. But also encountered a lot of problems. Record it here.
Problem: When submitting a form trigger check, the results of the remote check rule cannot be returned in time, resulting in a validation pass.
Scene:
In the modification page of the organization management, the teller is responsible for verifying the validity. The code is as follows:
Whether the checksum is repeated
Remote: {
URL: "CIFORG/CHECKMANTLR",//Background handler
Type: "POST",//Data sending method
DataType: "JSON",//Accept data format
Data: {//To be passed
Mantlr:function () {
Return $ ("Input[name= ' MANTLR ')". Val ();
},
Bdttdt:function () {
Return $ ("Input[name= ' Bdttdt ')". Val ();
}
}
}
When an illegal value is entered, click Submit directly to trigger the validation of the entire form.
It is expected that the popup prompt box, "Enter the error, please check."
The actual situation is: Check the first pass, pop confirm the confirmation of the modified prompt box, and then responsible for the teller's check results are displayed. (The teller's text box becomes red after confirming the pop-up window)
Cause Analysis: Use remote asynchronous checksum when clicking Submit, $ ("#ciforg"). Validate (). form (); The method does not wait for the remote method to validate, and returns the result true.
So how to make the remote asynchronous check into a synchronous check, and return the check results in time.
The code is as follows:
{csdn:code:rules:{
mantlr:{//verify the presence of the input teller number
rangelength:[6,6],
Digits:true,
Whether the checksum is repeated
Remote: {
URL: "CIFORG/CHECKMANTLR",//Background handler
Type: "POST",//Data sending method
DataType: "JSON",//Accept data format
Cache:false,
Async:false,
Data: {//To be passed
Mantlr:function () {
Return $ ("Input[name= ' MANTLR ')". Val ();
},
Bdttdt:function () {
Return $ ("Input[name= ' Bdttdt ')". Val ();
}
}
}
}}
The key is to add the properties of the red part of the image above.
Of course you can also use the custom method, in fact using AJAX, set up synchronization to complete the verification.
jquery.validator.addmethod ("Phonesame", function (value, element) { //use Jquery ajax method to verify that the phone is present var flag = 1; $.ajax ({ type: "POST", url: ' tel.php ', async:false, //synchronous method, if used asynchronously, flag is always 1 data:{' Tel ':value}, success: function (msg) { if (msg == ' yes ') { flag = 0; } } }); if (flag == 0) { return false; }else{ return true; } }, "sorry number have Been exist "); &nBsp