title: multiple ajax call not working asynchronously
body: <p>I have created to webMethod on the page where those method will be called with $.ajax() at client side.  First Webmethod is working on time consuming task. Task takes more than 8 minutes to complete.  Immediately after making ajax call to first method I am making call to another Web Method, which finish in a second or 2.  So I should be getting the response from second WebMethod ajax call immediately.  But here, in this case Second Web Method not executing untill first call finish.  Below example simulate the my scenario.</p>
  
  <pre><code>[WebMethod]
  public static string PullData(int snapshotId)
  {
      string str = "Pull Started: " + DateTime.Now.ToString() + "\n";
      Thread.Sleep(30000);
      str += "Pull End: " + DateTime.Now.ToString();
      return new JavaScriptSerializer().Serialize(str);
  }
  
  [WebMethod]
  public static string CheckStatus(int snapshotId)
  {
      return new JavaScriptSerializer().Serialize("Check Status" + DateTime.Now.ToString());
  }
  </code></pre>
  
  <p>Below is Javascript call on button click.</p>
  
  <pre><code>   &lt;script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"&gt;&lt;/script&gt;
  
      &lt;script language="javascript" type="text/javascript"&gt;
  
           function pullData(){
  
               $.ajax({ type: 'POST',
                   url: 'Default.aspx/PullData',
                   data: '{ snapshotId: 101 }',
                   contentType: 'application/json; charset=utf-8',
                   dataType: 'json',
                   success: function (msg) {
                       var curMsg = $("#message").attr("innerHTML") + "&lt;br /&gt;";
                       $("#message").attr("innerHTML", curMsg + msg.d);
                   },
                   error: function (jqXHR, textStatus, errorThrown) {
                       alert(jqXHR.responseText);
                   }
               });
  
              CheckStatus();
              return false;
          }
  
  
          function CheckStatus() {
              //alert("this is check status");
              $.ajax({ type: 'POST',
                  url: 'Default.aspx/CheckStatus',
                  data: '{ snapshotId: 101 }',
                  contentType: 'application/json; charset=utf-8',
                  dataType: 'json',
                  success: function (msg) {
                      var curMsg = $("#message").attr("innerHTML") + "&lt;br /&gt;";
                      $("#message").attr("innerHTML", curMsg + msg.d);
                  },
                  error: function (jqXHR, textStatus, errorThrown) {
                      alert(jqXHR.responseText);
                  }
              });
  
              return false;
          }
  
      &lt;/script&gt;
  </code></pre>
  
  <p>in this above calls <strong>CheckStatus</strong> Method should return response, before <strong>PullData</strong> Method return the response.  But <strong>CheckStatus</strong> executing after <strong>PullData</strong> finish its job.</p>
  
  <p>I may be missing here or not aware of complete behavior.  Please help!!!</p>
  
  <p>Has anybody encountered this issue?</p>