How to update datatable after AJAX-Call

rencarl

Hi,

this is my datatable:

$("#datatable_" + this.plugin).dataTable({
"bProcessing": true,
"bServerSide": true, // Server-side processing
"sAjaxSource": this.ajaxURL,
"fnServerData": function(sSource, aoData, fnCallback){

var s = $("#datatable_crm_plugin_filter input").val();

var oSettings = this.fnSettings();

// ASC or DESC?
var arrSort = String(oSettings.aaSorting).split(",");
var index_order_by = arrSort[0];
var order = arrSort[1];

var order_by = oSettings.aoColumns[index_order_by].mDataProp;

var startIndex = oSettings._iDisplayStart;
var limit = oSettings._iDisplayLength;
var ts = time();

$.ajax({
"dataType": "json",
"url": sSource,
"data": {"action":"search","search":s,"order":order,"order_by":order_by,"startIndex":startIndex,"limit":limit,"ts":ts},
"success": function(r){
fnCallback(r);
}
});
},
"aoColumnDefs": [
{"aaSorting": [], "aTargets":["_all"]},
{"sDefaultContent": "empty", "aTargets":["_all"]},
{"bSortable": true, "aTargets":[0,1,2]},
{"bSortable": false, "aTargets":[3]},
{"mDataProp": "title", "aTargets":[0]},
{"mDataProp": "title_short", "aTargets":[1]},
{"mDataProp": "title_intern", "aTargets":[2]},
{"mDataProp": "id_plugin", "aTargets":[3]}
]
});

The first AJAX-call is ok. The server responses the data in JSON-format and the table displays the data, everything is fine. Now i want to sort a specific column. I click on the title to init the request, the server responses the new sorted data in JSON-format, but the table still shows the data -order of the first call.

How do i update the datatable after the server response?

Thx!

rencarl

Hi,

here are some more infos for a better understanding, i hope.

This is my first request (order asc):
my.ajax.php?action=search&search=&order=asc&order_by=title&startIndex=0&limit=10&ts=1327074063000

This is my first response:
{"sEcho":1,"iTotalRecords":"8","iTotalDisplayRecords":8,"aaData":[
{"id_plugin":"3","title":"Titel unter dem Bild 1",...},
{"id_plugin":"4","title":"Titel unter dem Bild 2",...},
{"id_plugin":"6","title":"Titel unter dem Bild 3",...},
{"id_plugin":"5","title":"Titel unter dem Bild 4",...},
{"id_plugin":"7","title":"Titel unter dem Bild 5",...},
{"id_plugin":"8","title":"Titel unter dem Bild 6",...},
{"id_plugin":"1","title":"Titel unter dem Bild 7",...},
{"id_plugin":"2","title":"Titel unter dem Bild 8",...}
]}

And the datatable shows the data in the following order:
"Titel unter dem Bild 1"
"Titel unter dem Bild 2"
"Titel unter dem Bild 3"
"Titel unter dem Bild 4"
"Titel unter dem Bild 5"
"Titel unter dem Bild 6"
"Titel unter dem Bild 7"
"Titel unter dem Bild 8"


Now i click on the first column "title" to get the data in reverse order.
This is my second request (order desc):
my.ajax.php?action=search&search=&order=desc&order_by=title&startIndex=0&limit=10&ts=1327074239000

This is my second response with reverse order:
{"sEcho":1,"iTotalRecords":"8","iTotalDisplayRecords":8,"aaData":[
{"id_plugin":"2","title":"Titel unter dem Bild 8",...},
{"id_plugin":"1","title":"Titel unter dem Bild 7",...},
{"id_plugin":"8","title":"Titel unter dem Bild 6",...},
{"id_plugin":"7","title":"Titel unter dem Bild 5",...},
{"id_plugin":"5","title":"Titel unter dem Bild 4",...},
{"id_plugin":"6","title":"Titel unter dem Bild 3",...},
{"id_plugin":"4","title":"Titel unter dem Bild 2",...},
{"id_plugin":"3","title":"Titel unter dem Bild 1",...}
]}

But the datatable still shows the old order:
"Titel unter dem Bild 1"
"Titel unter dem Bild 2"
"Titel unter dem Bild 3"
"Titel unter dem Bild 4"
"Titel unter dem Bild 5"
"Titel unter dem Bild 6"
"Titel unter dem Bild 7"
"Titel unter dem Bild 8"


Is there an easy way to update the datatable with the new data or do i have to delete the datatable data and put the new data into the datatable? That is what i would do now.

Best regards!

rencarl

Got it! "sEcho" has to be in the request and in the response

f. e.
$arrWithRetValues = array("sEcho" => intval($args['sEcho']),...);

Thx!