Modify the DataTable ajax method, content-type and url on the fly without detroying the table.

Modify the DataTable ajax method, content-type and url on the fly without detroying the table.

HaneefHaneef Posts: 1Questions: 1Answers: 0

Hi Guys,

I recently encountered a scenario to which I need a solution. I have few DataTables in a page which should be refreshed/reloaded based on different parameters(basically a filter will be there and user could able to select different options and those values are passed to the server and table should be reloaded).

Problem:

Initially my DataTable is initialised with some url(with filter values passed as url params, example: /rest/measures?Key1=Value1&Key2=Value2) and ajax method as "GET" and using client side processing only.

Now when user selects more than 1000 values in the filter which results in URL getting too large and it cannot be processed as "GET" request. Hence I would like to use "POST" request. Here is the actual problem, I couldn't able to change the ajax method from "GET" to "POST" on the fly without destroying the DataTable and reinitialise the same table with same properties only difference is the method as "POST"(Destroying the DataTable and rebuilding is not feasible in my application architecture set up since user would change the filters as when they need and destroying the DataTable and rebuilding it every time when filter is changed is not a valid solution).

After some research, I used the below logic to change the ajax method as "POST" without destroying the DataTable but my request "Content-Type" is sent as "application/x-www-form-urlencoded; charset=UTF-8" which is not the format my web service needs/expects. My back end service expects the params in "application/json" format.

var datatable = element.find('#tableid').DataTable(); var tableSettings = datatable.settings()[0]; tableSettings.sServerMethod = "POST"; tableSettings.sAjaxSource = url; tableSettings.aoServerParams.push({ "fn": function(aoData) { alert("inside tableSettings"); aoData.push({ "name": "Key1", "value": "Value1" }); }, "sName": "addParams" }); datatable.ajax.url(path).load();

Please let me know a solution on how to change the ajax source url, method as "POST" and sending params in "application/json" format without destroying the table on the fly. Any suggesstion and solution is much appreciated since I have been stuck up with this issue for past 1 week.

This discussion has been closed.