🤯 50% Off! 700+ courses, assessments, and books

jQuery validation validate only on form submit

Sam Deering
Share

If your using the jQuery validation plugin you might sometimes see a stutter validation when your typing in an input field. This is most commonly seen when your using custom validation rules which are firing off ajax requests to validate the users input, such as checking if a users email is unique in the database. Stutter = no good.

To remove the consant validation checking add the following parameters to the form validate function:

onkeyup: false,
   onclick: false,
   onfocusout: false,

So your validation function might look something like this:

$("#form").validate(
{
   onkeyup: false,
   onclick: false,
   onfocusout: false,

   //validation rules
   rules: {

       ...

   },

   //validation messages
   messages: {
   
       ...

   },

   //submit handler
   submitHandler: function(form)
   {

       ...

   }

})

Other $.validate() options

messages: {},
groups: {},
rules: {},
errorClass: "error",
validClass: "valid",
errorElement: "label",
focusInvalid: true,
errorContainer: $( [] ),
errorLabelContainer: $( [] ),
onsubmit: true,
ignore: ":hidden",
ignoreTitle: false,
onfocusin: function(element, event) { ... },
onfocusout: function(element, event) { ... },
onkeyup: function(element, event) { ... },
onclick: function(element, event) { ... },
highlight: function(element, errorClass, validClass) { ... },
unhighlight: function(element, errorClass, validClass) { ... }