asp.net jquery datatables.net webmethod

Question

I am using ASP.net 3.5. A call to a Webmethod using JQuery returns valid JSON data. However when I call the same webmethod to populate a html table using the datatables.net JQuery plugin, I get back the entire html of the page.

**WebMethod:**
 <WebMethod()> _
         Public Shared Function GetData() As String
        Dim a As String = "{""aaData"": [['Trident','Internet Explorer 4.0']]}"
        Return a
    End Function


**Successful JQuery call:**
 $("#Result").click(function() {
    $.ajax({
      type: "POST",
      url: "Default2.aspx/GetData",
      data: "{}",
      contentType: "application/json; charset=utf-8",
      dataType: "json",
      success: function(msg) {
        // Replace the div's content with the page method's return.
        $("#Result").text(msg.d);

      }
    });
  });
});

Unsuccessful JQuery call:

$(document).ready(function() {
    $('#example').dataTable({
        "bProcessing": true,
        "bServerSide": true,
        "sAjaxSource": "Default2.aspx/GetDate",
        "fnServerData": function(sSource, aoData, fnCallback) {
        $.ajax({
        "dataType": 'json',
        "url": sSource,
        "data": aoData,
        "success": fnCallback
        });
        }
    });
});

Any thoughts on why the second call returns html? I tried adding contentType: "application/json; charset=utf-8", to the second ajax call. I get an error.

Answer 1

May be you are calling a method which does not exist, so may be an error page is coming in response. Better check what is coming in your response.

"sAjaxSource": "Default2.aspx/GetDate",

In successful call you are using GetData method

url: "Default2.aspx/GetData",

In unsuccessful call you are calling GetDate method.

Answer 2

contentType: application/json is going to be required. What is the error you get when supplying that?

Perhaps there is an encoding error; see http://stackoverflow.com/questions/26620/how-to-set-encoding-in-getjson-jquery