Solutions to cache problems verified by Jquery validation remote

Jquery validation has been used for validation in recent projects. It works well with bootstrap and jquery form. However, the caching problem of remote verification has left me a headache for a long time, almost like dropping this plug-in.

Example:

Existing school, grade, and class entity

There cannot be the same grade in the same school, and there cannot be the same class in the same grade.

Taking a school that cannot have the same grade as an example, the remote method is used for verification:

JS
Copy codeThe Code is as follows:
"GradeId ":{
Required: true,
Min: 0,
Remote :{
Url: "gradeManager-checkGrade.action ",
Type: "post ",
DataType: "json ",
Data :{
'Gradeid': function (){
Return $ ("# gradeId"). val ();
},
'Schoolid': function (){
Return $ ("# schoolId"). val ();
}
}
}
}

HTML
Copy codeThe Code is as follows:
<Div class = "control-group">
<Label class = "control-label" for = "schoolId"> school </label>
<Div class = "controls">
<S: select name = "schoolId" list = "schools" listKey = "schoolId"
ListValue = "schoolName" headerKey = "-1" headerValue = "select a school"> </s: select>
</Div>
</Div>

<Div class = "control-group">
<Label class = "control-label" for = "gradeId"> Grade </label>
<Div class = "controls">
<S: select name = "gradeId" list = "grades" listKey = "gradeId"
ListValue = "gradeName" headerKey = "-1" headerValue = "select Grade"> </s: select>
</Div>
</Div>

There are now test schools 1, test schools 2, and two schools, of which test school 1 has the first and second grades of primary school.

Theoretically, if the school chooses to test school 1 when adding a new grade, remote verification will report the error "this grade already exists" when the first and second grades are selected"

In fact, the results are correct during the first operation.
 
However, if you change the school at this time, for example, if you select test school 2, the validation plug-in will not perform new remote verification due to cache problems and will directly return the result of the previous verification, so there is the following problem:
 
This is not the most difficult to accept. If you select test school 2 and first-year primary school, remote verification is passed, then test school 1 is selected, and remote verification is still passed, as a result, the same school cannot have the same grade verification is equivalent to failure.


As a result, various query solutions are carried out.

There is a saying that "cache: false" is added to remote, but the actual measurement does not solve the problem.

I tried to bind the onchange event to clear the gradeId value in the school drop-down box and still cannot solve the problem.

After checking the validation api, we found that the. valid () method can trigger verification actively. However, due to cache problems, remote verification has not been performed again.

I also checked the validation source code and found that there is a previusvalue. If there is a value, I will directly return the previous verification result.
 
So I tried to clear this value.
Copy codeThe Code is as follows:
$ ("# SchoolId"). change (function (){
$ ("# GradeId"). removeData ("previusvalue ");
});

Solved successfully