how can I trigger jquery datatables fnServerData to update a table via AJAX when I click a button?

Question

I\'m using the datatables plugin with server-side data and am updating the table using AJAX.

My dataTables setup looks like this:

tblOrders = parame         


        

Answer 1

All the solutions mentioned before have some problem (for example, the additional user http paramaters are not posted or are stale). So I came up with following solution that works well.

Extension function (My params are array of key value pairs)

$.fn.dataTableExt.oApi.fnReloadAjax = function (oSettings, sNewSource, myParams ) {
if ( oSettings.oFeatures.bServerSide ) {
    oSettings.aoServerParams = [];
    oSettings.aoServerParams.push({"sName": "user",
        "fn": function (aoData) {
            for (var i=0;i


Example usage to put in you refresh event listener.

oTable.fnReloadAjax(oTable.oSettings, supplier, val);



Just one thing to pay attention to. Do not redraw table, once it's created, beacuse it's time consuming. Therefore, be sure to draw it only the first time. Otherwise, reload it

var oTable;
if (oTable == null) {
    oTable = $(".items").dataTable(/* your inti stuff here */); {
}else{
    oTable.fnReloadAjax(oTable.oSettings, supplier, val);
}