Jquery validator plugin ajax submition not triggering

问题

I have a problem with my the Jquery validator (http://bassistance.de/jquery-plugins/) plugins submitHandler function. The form is validated correctly and the invalid handler message triggers correctly, but the submitHandler functions will not trigger correctly and the ajaxSubmit function does not trigger corectly. Any one see what I have done wrong? Any help would be most wellcome.

<script type="text/javascript">
$(document).ready(function() {
var submitMessage     = $('#submit-message'),
    messageContainer  = submitMessage.find('span'),
    loading           = $('#loading');

function showSuccess(message) {
    messageContainer.text(message)
    messageContainer.attr('class', 'success');
  }
function showFailure(message) {
    messageContainer.text(message)
    messageContainer.attr('class', 'failure');
}
$("#contact-form-info").validate({
  rules: {
    contact_Name: {
      minlength: 2,
      maxlength: 50,
      required: true
    },
    contact_Foretag: {
      minlength: 1,
      maxlength: 50
    },
    contact_Email: {
      required: true,
      email: true
    },
    contact_Subject: {
      required: true,
      minlength: 5,
      maxlength: 50
    },
    contact_Message: {
      required: true,
      minlength: 10,
      maxlength: 5000
    }
  },
  submitHandler: function(form) {
        var options = {
            beforeSubmit: function() {
                loading.show();
            },
            success: function() {
                showSuccess('Thank you! Your email has been submitted.');
                form.reset();
                loading.hide();
            },
            error: function() {
                showFailure("We're sorry, your email could not be sent. Please try again later.");
                loading.hide();
            }
        };
        $(form).ajaxSubmit(options);
     return false;

    },
    invalidHandler: function() {
        showFailure('There were some problems with your submission.');
    }
 });
});
</script>

Here is my code in jsFiddle. http://jsfiddle.net/JwNmK/

回答1:

OP's comment:

"when I submit a valid form it is submited as a 'normal' form, I am redirected to the process.php page"

You definitely need a return false at the end of your submitHandler callback function when using ajax.

submitHandler: function (form) {
    // your ajax
    return false;
},

来源：https://stackoverflow.com/questions/16108083/jquery-validator-plugin-ajax-submition-not-triggering

标签

jquery

jquery-validate