.NET Web API not receiving parameters from datatables

whaliim

Description of problem:
I am developing a .NET MVC with Web API and datatables. My datatables receives data from an API Controller method /api/getData. The data is successfully shown on the datatables. For the next step, I would like to use serverSide Processing because there will be a lot of data from the backend there eventually. However, the backend always receives empty DataTablesAjaxPostModel. I have checked on the JS, the parameter is filled. How do I resolve this?

Here are my relevant codes and result:
JS

$('#list').DataTable({
    "scrollX": true,
    "searchDelay": 500,
    "createdRow": function (row, data, dataindex) {
        $(row).attr('data-id', data.repID);
    },
    "language": {
        "url": "\German.json"
    },
    "processing": true,
    "serverSide": true,
    "order": [[0, 'asc']],
    "columns": columnsConfig.default,
    "ajax": {
        "url": "/api/getData",
        "dataSrc": "data",
        "type": "POST",
        "contentType": "application/json; charset=utf-8",
        "dataType": "json",
        "data": function (d) {
            if (window.datatables_filter) {
                d.filter = window.datatables_filter;
                window.datatables_filter = "";
            }
            else {
                d.filter = "";
            }
            console.log(JSON.stringify({ parameters: d }));
            return JSON.stringify({ parameters: d });
        }
       
    },
    "initComplete": function () {
        $('.dataTables_filter input[type="search"]').css({ 'width': '400px' });
    }
});

C#
I have also created DataTableAjaxPostModel class but I add one field "filter".[https://datatables.net/forums/discussion/40690/sample-implementation-of-serverside-processing-in-c-mvc-ef-with-paging-sorting-searching]

public class APIController : ApiController
    {
        [Route("api/getData"), System.Web.Http.HttpPost, ActionName("getData")]
        public HttpResponseMessage getData([FromBody] DataTableAjaxPostModel parameters)
        {
            DataTableStaffResponse res = new DataTableStaffResponse();
            List<Data> dataList= new List<Data>();
            try
            {
                Utilities.LogDebug("parameters " + JsonConvert.SerializeObject(parameters));
                //all logic here

                res.draw = parameters.draw;
                res.data = dataList;
                res.recordsFiltered = dataList.Count;
                res.recordsTotal = dataList.Count;

                return Request.CreateResponse((HttpStatusCode)200, res);
            }
            catch (Exception ex)
            {
                Utilities.LogError("AppsController/getData GET ERROR: " + ex.Message + " " + ex.StackTrace);
                return Request.CreateResponse((HttpStatusCode)500, dataList);
            }
        }
  }

Output on my JS (console.log(JSON.stringify({ parameters: d })));:

{
    "parameters": {
        "draw": 2,
        "columns": [{
                "data": "lastName",
                "name": "",
                "searchable": true,
                "orderable": true,
                "search": {
                    "value": "",
                    "regex": false
                }
            }, {
                "data": "firstName",
                "name": "",
                "searchable": true,
                "orderable": true,
                "search": {
                    "value": "",
                    "regex": false
                }
            }
        ],
        "order": [{
                "column": 0,
                "dir": "asc"
            }
        ],
        "start": 0,
        "length": 10,
        "search": {
            "value": "",
            "regex": false
        },
        "filter": ""
    }
}

Output C# (LogDebug)

{
    "draw": 0,
    "start": 0,
    "length": 0,
    "columns": null,
    "search": null,
    "order": null,
    "filter": null
}

allan

I've put your DataTables initialisation into here: http://live.datatables.net/xuvojuxe/1/edit . It will throw an error since there isn't anything at that route on our server, but it does let us check what is being sent to the server:

So the data is definitely being sent (at least in that example - you don't link to a test case, so I can't say 100% for certain, but it seems likely).

Which suggests to me the issue is with the server-side. Have you put a breakpoint at the top of the function to check what parameters is? That's where I would suggest starting.

Allan

whaliim

Hi Allan,

Thank you for your reply. I got it working by changing the return on my ajax.data to return JSON.stringify({ d }); (Without parameters).

The above code works on .NET WebForms but apparently not on .NET Web API. So I need to adjust that.