JAG JAG - 15 days ago 5
ASP.NET (C#) Question

DataTables in ASP.net using JSON

Using JQuery DataTables in ASP.net and trying to return JSON data to it from C#

WebMethod
.

C# method...

[System.Web.Services.WebMethod]
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]
public static string Data()
{
string json = string.Empty;

using (IDataReader reader = DBUtil.GetReader("data", "data", "pram"))
{
if (reader != null)
{
DataTable dt = new DataTable();
dt.Load(reader);
reader.Close();
json = JsonHelper.GetJsonFromDataTable(dt);
}
}
return json; //also tried by adding "{\"aaData\": " + json + "}"
}


Working....

var source = {};
$.ajax({
type: 'POST',
dataType: 'json',
url: "page.aspx/Data",
contentType: 'application/json; charset=utf-8',
cache: false,
data: {},
success: function (response) {
source = $.parseJSON(response.d);
alert(response.d); // i can see Json formatted data

},
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert("Request: " + XMLHttpRequest.toString() + "\n\nStatus: " + textStatus + "\n\nError: " + errorThrown);
}
});


Not working....... (not even hitting the method break point)

$(".JGrid").dataTable({
"bJQueryUI": true,
"sAjaxSource": "../page.aspx/Data", //also tried with var 'source' (declared sbove)
"aoColumns": [
{ "sTitle": "Col1name", "sWidth": "33%" },
{ "sTitle": "Col2name", "sWidth": "33%" },
{ "sTitle": "Col3name", "sWidth": "33%" }
]
});

Answer
$("#table-tripNote").dataTable({
                "oLanguage": {
                    "sZeroRecords": "No records to display",
                    "sSearch": "Search from all Records"
                },
                "bProcessing": true,
                "bServerSide": true,
                "bDestroy": true,
                "sAjaxSource": "frmTrip.aspx/GetMemberNotesByTrip",
                "sPaginationType": "full_numbers",
                "bDeferRender": true,
                "aoColumns":
                            [
                                null,
                                null,
                                null,
                                null,
                                null,
                                null,
                                null
                            ],
                "fnServerData": function (sSource, aoData, fnCallback) {
                    $.ajax({
                        "dataType": 'json',
                        "contentType": "application/json; charset=utf-8",
                        "type": "GET",
                        "url": sSource,
                        "data": aoData,
                        "success":
                                                    function (msg) {

                                                        var json = jQuery.parseJSON(msg.d);
                                                        fnCallback(json);
                                                        $("#table-tripNote").show();
                                                    }
                    });
                }
            });

This was working for me

Check it out

Comments