title: Form OnSubmit to wait jQuery Ajax Return?
body: <p>I want to trigger <code>$.ajax</code> on form <code>onsubmit</code> and <code>return true</code> only after Ajax return is something valid.</p>
  
  <p>For example:</p>
  
  <pre><code>&lt;form id="myForm" onsubmit="return ajaxValidation();"&gt;
      &lt;input id="myString" name="myString" type="text" /&gt;
      &lt;input type="submit" value="Submit" /&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>In Javascript:</p>
  
  <pre><code>function ajaxValidation() {
      $.ajax({
          async: false,
          type: "POST",
          url: "ajax.php",
          data: { myString: $("#myString").val() }
      }).success(function( response ) {
          alert(response); //Got 'ok'
          if (response=="ok") {
              return true; //mark-1
          } else {
              alert("Oh, string is wrong. Form Submit is cancelled.");
          }
      });
      return false; //mark-2
  }
  </code></pre>
  
  <p>When i submit, i got alert <code>ok</code>, but it returned 'false' because it jumped to final <code>return false</code> line.</p>
  
  <p>Why? I can not understand. Actually, it should hit to <code>return true</code> line. (And, even after <code>return true</code>, the function should stop there and just come out of it)</p>
  
  <p>So it is now means, the parent function <code>does NOT wait</code> to the Ajax Return. Instead, it is continuously running down to the end. Any idea why, please. How to make the parent function to be waiting the Ajax?</p>