title: jQuery Validation plugin: submitHandler not preventing default on submit when making ajax call to servlet - return false not working
body: <p>I have a simple form that uses jquery and a servlet.  The jquery makes an ajax call to the servlet, the servlet makes some server side calculations, then displays the results on the same page via jQuery.  I don't want the form to do a default submit (and go to the servlet) because I want to stay on the same page and display results dynamically. It works exactly how I want it to as is:</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;form name="form1" action="FormHandler1" method="POST" class="stats-form"&gt;
      &lt;input class="stats-input" id="number0" type="text" name="number0"&gt;
      &lt;input id="number1" type="text" name="number1"&gt;
      &lt;input id="number2" type="text" name="number2"&gt;
      &lt;input id="number3" type="text" name="number3"&gt;
      &lt;input type="submit" value="Calculate" class="calculate-stats" name="stats-submit"&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>jQuery:</p>
  
  <pre><code>form.submit (function(event) {
      $.ajax({
          type: form.attr("method"), // use method specified in form attributes
          url: form.attr("action"), // use action specified in form attributes (servlet)
          data: form.serialize(), // encodes set of form elements as string for submission
          success: function(data) {
              // get response form servlet and display on page via jquery 
          }
      });
      event.preventDefault(); // stop form from redirecting to java servlet page
  });
  </code></pre>
  
  <p>Now, I wanted to add form validation, since the servlet expects decimal numbers to do it's calculations.  The user should only be allowed to enter numbers, no other characters.  To do this I adopted the popular <a href="http://jqueryvalidation.org/" rel="nofollow">jQuery Validation</a> plugin.  </p>
  
  <p>The validation works as expected, but to make my ajax call to the servlet I have to use the submitHandler jQuery Validation provides, instead of the jQuery submit method shown above.  When I use the validation submitHandler, the default action of the form on submit is executed, going to the servlet page instead of staying on the same page to display my results dynamically in jQuery.  I have to pass the formHandler a form, instead of an event like before, which allowed me to prevent the default action.  The only option is to     return false, but it doesn't work.  I've been trying to figure this out for the past two days, and have pretty much exhausted my google-fu.  Here is the new code giving me grief:</p>
  
  <pre><code>form.validate({
         rules: {
              number0: ruleSet,
              number1: ruleSet,
              number2: ruleSet,
              number3: ruleSet,
          },
          submitHandler: function (form) {
  
              $.ajax({
                  type: "POST",
                  url: form.attr("action"),
                  data: form.serialize(),
                  success: function () {
                      // get response from servlet and display on page via jQuery 
                  }
              });
              return false; // required to block normal submit ajax used
          }
   });
  </code></pre>
  
  <p>Any help would be appreciated, I'd like to use this neat jQuery form validation, but I may just write my own jQuery validation from scratch so that I can use the form submit method that I already have working.</p>