CODEWITHSUNDEEP
jquery
Ankit
Ankit

Reputation: 622

Call a function on success jQuery validation plugin when all validation are done

<script id="demo1" type="text/javascript">

jQuery(document).ready(function () {
    var validator = jQuery("#login").validate({
        rules: {
            pwd: "required",
            log: {
                required: true,
                email: true,
            },
        },
        messages: {
            pwd: "Please enter password",
            log: {
                required: "Email is required",
                email: "Please enter a valid Email Address",
            }
        },
        errorPlacement: function (error, element) {
            if (element.is(":radio"))
                error.appendTo(element.parent().next().next());
            else if (element.is(":checkbox"))
                error.appendTo(element.parent().next("span#error"));
            else
                error.appendTo(element.parent().next("div#error"));
            //error.appendTo ('div#error').show().fadeOut(4500);
        },
        success: function (label) {
            // set &nbsp; as text for IE
            label.html("&nbsp;").addClass("checked");
        }
    });
});
</script>

I have this script to validate the form, this script runs well for my form, i want to run a function when all the fields are validated , means inputs are correct , if i call function inside success then it runs everytime when a single input is validated, but i want to call it after all the inputs are correct, please help, i am trying different ways from last one hour with no result..

Upvotes: 5

Views: 3229

Answers (4)

Saheb Mondal
Saheb Mondal

Reputation: 163

below code work for me 

jQuery(document).ready(function() {

var validator = jQuery("#login").validate({

    rules: {

            pwd: "required",

        log: {

            required: true,

            email:true,

        },

    },

    messages: {

        pwd: "Please enter password",

        log: {

            required: "Email is required",

            email:"Please enter a valid Email Address",

        }

    },

    submitHandler: function(form) {
        // call your function
        $("#login")[0].submit(); 
    }

});

});

Upvotes: 1

jviotti
jviotti

Reputation: 18939

I've had a similar problem once. Maybe my approach can help you too.

Every input got added a valid or invalid class when validated.

I then just looped trough the inputs and checked if all of them were valid:

function allValid(inputs) {
  for(var x = 0; x < inputs.length; x++) {
    if(!$(inputs[x]).hasClass('valid')) {      
      return false;
    }
  }
  return true;
};

var myInputs = $('#MyForm input');

if(allValid(myInputs)) {
  // All inputs are valid!
}

Upvotes: 0

Vasily Komarov
Vasily Komarov

Reputation: 1425

Your can use validator.form() method to validate a form

var validator=$("#find_your_form").validate({onsubmit: false});
......................................
if(validator.form()){
  //Validate passed
  ohYeh();
} else {
  //Validate 
  ohCrap();
}

Upvotes: 0

mzgajner
mzgajner

Reputation: 2348

Make a counter:

var successfulValidations = 0;

Add to it in your success function:

success: function(label) { successfulValidations++; }

After the validation, check against number of all elements validated:

if(validatedElementsCount === successfulValidations) {
    doSomething();
}

Upvotes: 0

Related Questions