title: How to stop Form submit if the validation fails
body: <p>UPDATE:
  my question is more about <code>How to prevent the form submit if the validation fails</code></p>
  
  <p>the link does not solve my problem</p>
  
  <p>just re-iterate what I'm doing:
  I have a form with bunch of input fields and when the user hit the submit button it validate form using attribute <code>required="required"</code> if the form validation fails THEN I want to stop submitting the form  as you see the javascript it show the div when the user submit the form.</p>
  
  <p>Hope this clears up.</p>
  
  <p>END UPDATE</p>
  
  <p>How can I stop the form submit to fire if the form validation fails?</p>
  
  <pre><code>&lt;input class="form-control" data-val="true" id="SerialNumber" name="SerialNumber" required="required" type="text"&gt;
  
  &lt;button type="submit" name="rsubmit" class="btn btn-success"&gt;Submit&lt;/button&gt;
  
   //loading message:
   $("form").submit(function (e) {
       $("#loading").show();
   }); 
  </code></pre>