title: Using JQuery and JSON to consume Asp.net Server-Side Asynchronous Web Methods
body: <p>I defined two webservices calls in ASP.NET:
   1.BeginLengthyProcedure and EndLengthyProcedure (Asynchronous web method)
   2.LengthProcedureSync</p>
  
  <pre><code>namespace ServiceDemo
  {
  [WebService(Namespace = "http://tempuri.org/")]
  [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
  [System.ComponentModel.ToolboxItem(false)]
  [System.Web.Script.Services.ScriptService]
  public class AsyncWebService : System.Web.Services.WebService
  {
      public delegate string LengthyProcedureAsyncStub(int milliseconds);
  
      public string LengthyProcedure(int milliseconds)
      {
          System.Threading.Thread.Sleep(milliseconds);
          return "SuccessAsync";
      }
  
      public class MyState
      {
          public object previousState;
          public LengthyProcedureAsyncStub asyncStub;
      }
  
      [WebMethod]
      [ScriptMethod(ResponseFormat = ResponseFormat.Json)]
      public IAsyncResult BeginLengthyProcedure(int milliseconds, AsyncCallback cb, object s)
      {
          LengthyProcedureAsyncStub stub = new LengthyProcedureAsyncStub(LengthyProcedure);
          MyState ms = new MyState();
          ms.previousState = s;
          ms.asyncStub = stub;
          return stub.BeginInvoke(milliseconds, cb, ms);
      }
  
      [WebMethod]
      [ScriptMethod(ResponseFormat = ResponseFormat.Json)]
      public string EndLengthyProcedure(IAsyncResult call)
      {
          MyState ms = (MyState)call.AsyncState;
          string res = ms.asyncStub.EndInvoke(call);
          return res;
      }
  
      [WebMethod]
      [ScriptMethod(ResponseFormat = ResponseFormat.Json)]
      public string LengthyProcedureSync(int milliseconds)
      {
          System.Threading.Thread.Sleep(milliseconds);
          return "SuccessSync";
      }
  }
  }
  </code></pre>
  
  <p>Then I consumed them using JQuery, I don't want to use ASP.NET AJAX. LengthProcedureSync worked fine, but LenghtyProcudure didn't work. Is there anything I missed?</p>
  
  <pre><code>&lt;script type="text/javascript" src="jquery-1.4.4.min.js"&gt;&lt;/script&gt;
  
  &lt;script type="text/javascript"&gt;
      function testJson() {
          $.ajax({
              type: "POST",
              //Didn't work
              url: "AsyncWebService.asmx/LengthyProcedure",
              //Work
              //url: "AsyncWebService.asmx/LengthyProcedureSync",
              data: "{'milliseconds':'2000'}",
              contentType: "application/json; charset=utf-8",
              dataType: "json",
              success: function (msg) {
                  $("#jsonResponse").html(msg.d);
              },
              error: function (msg) {
  
              }
  
          });
      };
  
  &lt;/script&gt;
  </code></pre>