title: Running jquery form validation and jquery form post script together
body: <p>I have 2 different scripts, one is <em>jquery post for form</em>, and second is <em>jquery form validation</em>.</p>
  
  <p>I run post script at submit button click action, so it takes effect before validation :/ and i could not change validation to run before post script :( so now it form submitting without validating.</p>
  
  <p>How can make it? Appreciate helps!</p>
  
  <hr>
  
  <p><strong>JQuery POST code</strong></p>
  
  <pre><code>$(function() {
  
    $("#btnsend").click(function() {
  
          var dataString = 'fullname='+ escape(document.contact.full_name.value);
          $.ajax({
            type: "POST",
            url: "query.php?act=sendMail",
            data: dataString,
            success: function() {
  
              $('#contact-form').hide()
                        .html("&lt;p&gt;thanks!&lt;/p&gt;")
                                .fadeIn(500, function() {$('#contact-form').append("");});
             } 
  
          });
  
          return false;
      });
  
  });
  </code></pre>
  
  <hr>
  
  <p><strong>JQuery Validation</strong></p>
  
  <p><em>thanks for plugin <a href="http://bassistance.de/jquery-plugins/jquery-plugin-validation/" rel="nofollow noreferrer">http://bassistance.de/jquery-plugins/jquery-plugin-validation/</a></em></p>
  
  <pre><code>&lt;!-- Form Validation --&gt;
  &lt;script src="inc/validation/jquery.validate.js" type="text/javascript"&gt;&lt;/script&gt;
  &lt;script src="inc/validation/js/cmxforms.js" type="text/javascript"&gt;&lt;/script&gt;
  &lt;link rel="stylesheet" type="text/css" href="inc/validation/css/validation.css" media="screen" /&gt;
  
  &lt;script type="text/javascript"&gt;
  $(document).ready(function() {
      $("#commentForm").validate();
  });
  &lt;/script&gt;  
  </code></pre>
  
  <hr>
  
  <p><strong>Form</strong></p>
  
  <pre><code>&lt;form id="commentForm" name="contact" method="post" action=""&gt;
      &lt;ul id="contact-form"&gt;
          &lt;li&gt;&lt;label for="full_name"&gt;Full Name: *&lt;/label&gt;&lt;input type="text" name="full_name" id="full_name" class="txt_input required" /&gt;&lt;/li&gt;
          &lt;li class="alignRight"&gt;&lt;input type="submit" value="Send" id="btnsend" name="btnsend" class="btn_submit" /&gt;&lt;/li&gt;
      &lt;/ul&gt;
  &lt;/form&gt;
  </code></pre>