views:

272

answers:

1

I am trying to combine ajaxSubmit with the validate plugin

Here is my code

It says the ajaxSubmit is not a function

$("#send-reply").validate({
        meta: "validate",
        errorElement: "em",
                errorClass: "error",
        validClass: "success",
        highlight: function(element, errorClass, validClass) {

            $(element).closest("div.required").removeClass(validClass);
            $(element).closest("div.required").addClass(errorClass);
            $(element).addClass(errorClass);
        },
        unhighlight: function(element, errorClass, validClass) {
            $(element).closest("div.required").removeClass(errorClass);
            $(element).closest("div.required").addClass(validClass);
            $(element).removeClass(errorClass);
        },
        debug:true,
                rules: {
            message:{required:true}
        },
        messages: {
        message:'',

        },
               submitHandler: function(form) {

                 form.ajaxForm({ target:'#result',
           success: function() {
          $('#send-reply').fadeOut(500);
          $('#send-reply').remove();
        },clearForm: true});

}});
A: 

Have you tried:

$(form).ajaxSubmit(....);

Two things there: 1) I think the function name is ajaxSubmit, where ajaxForm overrides the submit handler. 2) you might be passed the DOM form object instead of the jQuery object with the form

gnarf
Odd that that it works The documentations says not to do $(form) because of recursion, guess that only applies to the normal .submit()
matthewb
`form.submit()` would call the DOM `submit` method on a DOM object, whereas `$(form).submit()` would trigger submit events on the form using jQuery, calling your validation again -- therefore the recursion warning.
gnarf