Using JQuery and JSON to consume Asp.net Server-Side Asynchronous Web Methods

Question

I defined two webservices calls in ASP.NET: 1.BeginLengthyProcedure and EndLengthyProcedure (Asynchronous web method) 2.LengthProcedureSync

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";
    }
}
}

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?

<script type="text/javascript" src="jquery-1.4.4.min.js"></script>

<script type="text/javascript">
    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) {

            }

        });
    };

</script>

Answer 1

Unfortunately, the .NET Framework's ASP.NET AJAX web service handler (which is used for JSON) does not provide support for asynchronous web service calls whereas the default ASP.NET web service handler does. There is an excellent book "Building a Web 2.0 Portal with ASP.NET 3.5" written by Omar AL Zabir describing a workaround for this shortcoming of the ASP.NET AJAX web service handler (see chapter 7, page 177). There is also a sample chapter available on MSDN. Hope, this helps!