CODEWITHSUNDEEP
jqueryjquery-forms-plugin
Trent Gm
Trent Gm

Reputation: 2487

jquery submit handler with jquery validate and jquery ajax form only gets called every second time

I have the following code

jQuery(function() {
      jQuery("#newForm").validate({
          rules: { },
          submitHandler: function(form) {
              alert("Submitting")
              jQuery("#submitButton").attr('disabled', true)
              jQuery("#sendWrapper").append('<span><img src="{{ STATIC_URL }}img/loading.gif"></span>')
              jQuery(form).ajaxSubmit({
                  success: afterFormSubmit,
                  target: "#ajaxwrapper"
              });
          }
      });
});

I'm finding that the handler is only getting called every first, third, fifth, 7th time the submit button is clicked (the response is pretty much just the form's html with errors etc inserted).

However, changing the function to an onclick handler works everytime.

Upvotes: 1

Views: 7016

Answers (1)

Jay
Jay

Reputation: 1404

This should works fine:

jQuery(function() {
      jQuery("#newForm").validate({
          rules: {},
          submitHandler: function(form) {
              alert("Submitting")
              jQuery("#submitButton").attr('disabled', true)
              jQuery("#sendWrapper").append('<span><img src="{{ STATIC_URL }}img/loading.gif"></span>')
              $.ajax({
                  cache: false,
                  type: 'POST',
                  data: ("#newForm").serialize(),
                  url : '/ your-url-address-to-post-form /'
                  success: function (html) {
                      alert('done');
                  },
                  error: function(data, textStatus, jqXHR) {
                      alert('error')
                  }
              });
          }
      });
});​

Upvotes: 2

Related Questions