Datatables: AJAX request generates error ...

ckoeber

Hello,

So the following pure jQuery AJAX request works fine:

$.ajax({

                type: "POST",
                url: "Team_MemberManagement.aspx/getActiveTeamMembers",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: OnSuccess,
                failure: function (response) {
                    alert(response.d);
                }

 });

However, with dataTables I use this code which connects to the same URL but the error message below:

function CreateTeamMemberDataTable() {

            $('#CurrentTeamMemberTable').dataTable({
                'bProcessing': true,
                'bServerSide': true,
                'bFilter': false,
                'scrollX': true,
                "ajax": {
                    "url": "Team_MemberManagement.aspx/getActiveTeamMembers",
                    "contentType": "application/json; charset=utf-8",
                    "dataType": "json",
                    "type": "POST"
                },
                "columns": 
                [
                    { "d": "Team.Code" },
                    { "d": "UserName" },
                    { "d": "FirstName" },
                    { "d": "LastName" },
                    { "d": "IsManager" }
                ]
            });

        }

And I get the following error message:

{"Message":"Invalid JSON primitive: draw.","StackTrace":" at
System.Web.Script.Serialization.JavaScriptObjectDeserializer.DeserializePrimitiveObject()\r\n at
System.Web.Script.Serialization.JavaScriptObjectDeserializer.DeserializeInternal(Int32 depth)\r\n at
System.Web.Script.Serialization.JavaScriptObjectDeserializer.BasicDeserialize(String input, Int32 depthLimit,
JavaScriptSerializer serializer)\r\n at System.Web.Script.Serialization.JavaScriptSerializer.Deserialize(JavaScriptSerializer
serializer, String input, Type type, Int32 depthLimit)\r\n at System.Web.Script.Serialization.JavaScriptSerializer.Deserialize[T]
(String input)\r\n at System.Web.Script.Services.RestHandler.GetRawParamsFromPostRequest(HttpContext context,
JavaScriptSerializer serializer)\r\n at System.Web.Script.Services.RestHandler.GetRawParams(WebServiceMethodData
methodData, HttpContext context)\r\n at System.Web.Script.Services.RestHandler.ExecuteWebServiceCall(HttpContext
context, WebServiceMethodData methodData)","ExceptionType":"System.ArgumentException"}

What gives?

Thank you.

tangerine

Does your server-side script implement all the parameters required for server-side processing ? (Assuming you actually need server-side.)

https://datatables.net/manual/server-side

ckoeber

Thanks, I don't use server side processing so I took that option out.

I am still getting weird javascript errors. I know that I am getting JSON data from the server.

Here is a pastebin of what I am getting:

http://pastebin.com/VXfAxvir

And here is the call to dataTables to generate the table:

function CreateTeamMemberDataTable() {

            var teamMemberDataTable;
            try {
                teamMemberDataTable = $('#CurrentTeamMemberTable').dataTable({
                    'bProcessing': true,
                    'bServerSide': false,
                    'bFilter': false,
                    'scrollX': true,
                    "ajax": {
                        "url": "Team_MemberManagement.aspx/getActiveTeamMembers",
                        "contentType": "application/json; charset=utf-8",
                        "dataType": "json",
                        "type": "POST"
                    },
                    "columns":
                [
                    { "d": "Team.Code" },
                    { "d": "UserName" },
                    { "d": "FirstName" },
                    { "d": "LastName" },
                    { "d": "IsManager" }
                ]
                });
                return teamMemberDataTable;   
            } catch (error) {
                console.log(error);
            }

        }

allan

Use ajax.dataSrc to tell DataTables to read data from the d property rather than its default of data.

Also there is no d option in the columns options. You want to use columns.data.

Allan