title: How to make an AJAX call wait for a server side response?
body: <p>These are my files : </p>
  
  <p><strong>index.html</strong></p>
  
  <pre><code>&lt;form action="#" method="POST"&gt;                           
  &lt;label for="Username"&gt;Username :&lt;/label&gt;&lt;br/&gt;  &lt;input type="text" id="Username" name="username"/&gt;&lt;span id="usr"&gt;&lt;/span&gt;&lt;br/&gt;  
  &lt;label for="Email"&gt;Email :&lt;/label&gt;&lt;br/&gt;  &lt;input type="text" id="Email" name="email"/&gt;&lt;br/&gt;
  &lt;input type="submit" value="Register" id="submit"/&gt;
  &lt;/form&gt; 
  </code></pre>
  
  <p><strong>userresponse.php</strong></p>
  
  <pre><code>&lt;?php
  require ("DBC.php");
  $usern = $_POST["username"];
  function isAvailable($str)
          {
              $sql= "SELECT username FROM mytable WHERE username = '$str'";
              $result=mysql_query($sql)or die();
              $count = mysql_num_rows($result);
  
              if($count&gt;0)
                  return true;
              else
                  return false;
           }
  
  if (isAvailable($usern) == true)
       echo "false";
  else    
       echo "true";
  
  ?&gt;
  </code></pre>
  
  <p><strong>checkuser.js</strong></p>
  
  <pre><code>$(document).ready(function() {
  var usrn = $("#Username");
  var usr  = $("#usr");
  
  usrn.blur(function(){
  if(usrn.val()=="")
      {
          usr.html("Empty field");
          return false;
      }
  else
      {
      var username = usrn.val();
      usr.html('Cheking username...');
                  alert(username);
      $.ajax({
              url: "userresponse.php",
              type: "POST",
              data: username,
              success: function (data) {  
              if(data.val() == "true")    
              {
                  usr.html('Available username');
              }
              else if(data.val() == "false")
              {
                  usr.html('Username already taken'); 
  
              }
            }})
        return data.val();
      }
  });
          });
  </code></pre>
  
  <p>I know that AJAX is asynchronous and doesn't wait for the response from the server but I want to know how to fix it and make this call wait for the response.</p>