title: Jquery Validation : Submit button have to be clicked twice for form submission (fire fox)
body: <p>I am using <code>jquery validation plugin</code> for <strong>US ZIPCODE CHECK</strong> ,its working fine,
  but I have to <strong>push the submit button TWICE</strong> to get the form submitted,</p>
  
  <p><strong>Note :</strong> if I press enter that it submits the form properly, but it doesnt work with <code>click event</code></p>
  
  <p>I <strong>already have checked</strong> this stackoverflow answers but they didnt helped me out</p>
  
  <p><a href="https://stackoverflow.com/questions/9838054/why-do-you-have-to-submit-twice-before-jquery-validate-submithandler-is-triggere">Why do you have to submit twice before jQuery Validate submitHandler is triggered?</a></p>
  
  <p><a href="https://stackoverflow.com/questions/20496840/jquery-validate-need-to-click-submit-twice-to-submit-form">jquery validate need to click submit twice to submit form</a></p>
  
  <p><a href="https://stackoverflow.com/questions/15671712/jquery-using-on-and-validate-must-submit-form-twice-to-validate">jQuery using .on and .validate must submit form twice to validate</a></p>
  
  <p>Below is my Javascript code</p>
  
  <pre><code>var ans;
  $(document).ready(function(e)
          {
             jQuery.validator.addMethod("zipcode", function(e)
              {
                 $.ajax(
                          {
                              url: "http://zip.elevenbasetwo.com",
                              cache: false,
                              async: false,
                              dataType: "json",
                              type: "GET",
                              data: "zip=" + $("#zip").val(),
                              success: function()
                              {
                                  ans = true;
                              },
                              complete: function()
                              {
                                  ans = true;
                              },
                              error: function()
                              {
                                  ans = false;
                              }
                          }
                  );
                  return ans;
              });
              $("#register-form2").validate({
                  debug: true,
                  onkeyup: false,
                  rules: {
                      zip: {
                          required: true,
                          zipcode: true,
                          minlength: 5
                      },
                      email: {
                          required: true,
                          email: true
                      }
                  },
                  messages: {
                      zip: {
                          required: "Please enter a USA zip code",
                          zipcode: "Please enter a valid USA zip code"
                      },
                      //  zip: "Please enter a valid USA zip code.",
                      email: "Please enter a valid email address."
                  },
                  submitHandler: function(form)
                  {
                      alert('hi');
                      form.submit();
                  }
              });
          });
  </code></pre>
  
  <p>Please mark that <strong>if I dont use ajax function in my custom method</strong> than it just works fine, but i am not able to solve it.</p>
  
  <p>below is my <code>HTML code</code></p>
  
  <pre><code>&lt;form action="&lt;?= $_SERVER['PHP_SELF'] ?&gt;" method="post" class="wpcf7-form" id="register-form2" novalidate&gt;
  &lt;input name="email" required id="email" type="text" placeholder="Email*"&gt;
  &lt;input type="text" name="zip" id="zip" required size="40" maxlength="15" placeholder="Zip code* (USA only)"&gt;
  &lt;input name="Form_submit" class="btn btn-primary wpcf7-form-control  wpcf7-submit" id="Submit" value="Sign-up" type="submit"&gt;
  &lt;/form&gt;
  </code></pre>