Question

I have a form with many fields which are displayed progressively. I need to check the fields to be OK before I show the next ones so I figured this out:

switch (index){
          case '1': 
              addRules1();
              break;
          case '2':
            addRules2();
            break;
          case '3':
              addRules3();
              break;
          }
          if ($("#contractForm").valid()){
//go to next group of inputs

The addRules functions look like this:

function addRules1(){
    $("#contractForm").validate({
        rules: {
        nom: {
           required: true,
           minlength: 2
         }
       },
       messages: {
           nom: {
           required: "the name!!",
           minlength: jQuery.format("At least {0} characters required!")
         }
       }        
    });                   
}
function addRules2(){

    $("#contractForm").validate({
        rules: {
        commune2: {
           required: true,
           minlength: 2
         }
       },
       messages: {
           commune2: {
           required: "the commune!!",
           minlength: jQuery.format("At least {0} characters required!")
         }
       }        
    }); 
}
function addRules3(){

    $("#contractForm").validate({
        rules: {
        addresseLivraison: {
           required: true,
           minlength: 2
         }
       },
       messages: {
           addresseLivraison: {
           required: "the addresse!!",
           minlength: jQuery.format("At least {0} characters required!")
         }
       }        
    });                                    
} 

For the first group everything is fine (on debugger also) but for the second one it just validates OK and moves on. Does the validator need to be reset or something? is there a easier way?

Answer 1

That is not how you would add and remove rules. As per the plugin’s documentation,

.rules('add', {
        required: true,
        number: true
});


.rules('remove', {
        required: true,
        number: true
});

Note: you must call .validate() on the form before using either of those methods.