Description
Your environment
- Version of
jquery-validate
: 1.19.5 - Browser name and version: Google Chrome 103.0.5060.114 / Firefox 102.0.1 / Microsoft Edge 103.0.1264.49
Current behavior
When a field has both a non-remote and a remote validation rule, if the server is a bit slow, a race condition can happen. The validation result for the previous value of a field replaces the one for its current value.
More precisely, for this bug to occur, the "new" value of the field must be something that will be considered invalid by the non-remote rule (which means the new value will not trigger a new Ajax request). A simple example is using a "required" rule and emptying the field, as shown in this live demo.
Expected behavior
The validation result for the latest value of the field should be displayed instead of the validation result for its previous value.
Live demo
https://codepen.io/bidord/pen/RwMoOeM
Both fields in this example have a "required" rule and a "remote" rule. The remote rule for the first field takes 0.1s, the remote rule for the second field takes 2secs.
Clicking "test" will:
- Fill both fields with some random value (and trigger validation)
- Wait for 1sec
- Empty both fields (and trigger validation again)
We expect both fields to be displayed as invalid with a "Field is required." error. However you should see that the field with a slow remote validation rule is incorrectly displayed as valid.
You can trigger this bug "manually" as well : just fill the second field with a single character then quickly remove it.