Datatables

Question

我已经 table 从服务器端加载了数据，因为我必须为服务器端加载大量数据集。

var table = $('#table').DataTable({ 
     "processing": true, 
     "serverSide": true, 
     "ajax" : { "url": "...", "type": "POST" }, 
     "columns": [ { 
        "orderable": false, 
        "data" : 'id', 
        "render" : function( data, type, meta ) 
                                 { return '..'; }
    },
    {
        "orderable": true,
        "data"     : ".."
    },
    {
        "orderable": true,
        "data"     : "..",
        "className": 'right-align'
    },
    {
        "orderable": true,
        "data"     : "..",
        "className": 'right-align'
    },
    {
        "orderable": false,
        "data"     : 'id',
        "defaultContent": "",
        "className": 'center-align',
        "render"   : function(data, type, meta) {

            return '..';
        }
    },
    {
        "orderable": false, // flags
        "data"     : {
            'inserted' : 'inserted',
            'deleted'  : 'deleted'
        },
        "defaultContent": "",
        "className"    : 'center-align',
        "render"   : '..'
        }
    }
],
'order': [
    [1, "asc"]
],
"language": {
    "lengthMenu": '..'
}

});

而且我必须为此 table 提供过滤功能（很少有复选框会触发 post 更改请求）所以我将过滤器发送到后端并提供我的新数据集。

$.post(url, { 'filters' : data} , function(collection){
     table.clear().draw();
     table.rows.add(JSON.parse(collection));
     table.columns.adjust().draw();
});

它总共触发了 3 个请求，一个是 post 请求，两个是绘制请求（因为我绘制了两次）。

根据服务器端处理，table 的每次抽取都会导致发出新的 Ajax 请求以获取所需数据。现在这个数据覆盖了我从过滤器获得的数据。

如何使用新数据集绘制 table？或者我怎样才能停止触发那些服务器端 ajax 请求。

我尝试了 preDrawCallback，它关闭了整个绘制功能。

$('#table').dataTable( {
  "preDrawCallback": function( settings ) {
     return false;
  }
});

Answer 1

您可以使用 ajax.data 指定发送到服务器的自定义参数，请参阅下面的方法之一。

$('#example').DataTable({
    "ajax": {
        "url": "data.json",
        "data": function (d){
            d.example_select = $('#example-select').val();
        }
    }
});

ajax.data 每次 DataTables 从服务器请求数据时都会调用回调函数。

要在过滤器更改后从服务器重新加载数据，您可以使用 ajax.reload() 函数，例如：

$('#example-select').on('change', function(){
    $('#example').DataTable().ajax.reload(); 
});

请参阅 this JSFiddle 进行演示。

Datatables - 如何在向 table 添加新数据时停止服务器端绘制事件

Datatables - How to stop the server side draw event when adding new data to table