初始加载后DataTables jQuery插件设置recordsTotal

时间:2017-08-02 00:36:00

标签: jquery performance datatables

我已经在网上搜索了这个,但似乎无法找到答案......

我有一个相对复杂的查询,它从大型数据库返回50条记录。此查询作为游标运行,因此速度很快,能够组装json并在~20ms内返回数据表。

但是,获取此查询的记录总数较慢(500毫秒)。

我希望能够进行并行ajax调用,并在已经渲染后在我的数据表上设置count(recordsCount),这样我就可以更快地在屏幕上看到数据。这可能吗?

作为一种解决方法,我正在考虑为我的查询创建一个计数缓存,但如果我能够轻松点击一些客户端代码,这似乎是不理想的。

这是我的数据表代码供参考:

var table = $('#myTable').DataTable({
    "dom": '<"top"iflp<"clear">>rt<"bottom"iflp<"clear">>',
    "processing": true,
    "serverSide": true,
    "searching": false,
    "ordering": false,
    "bSort": false,
    "scrollX": false,
    "fixedHeader": true,
    "deferRender": true,
    "iDisplayStart": (startPage * pageLength),
    "ajax": {
      "url": url,
      "type": "POST",
      "data": function (d) {

      }
    },
    "pagingType": "full_numbers",
    "columnDefs": columnDefs,
    "responsive": false,
    "columns": columnDataStructure,
    "order": [[0, "desc"]],
    "lengthMenu": [10,25,50,100],
    "initComplete": function(settings, json){

    }
  })

1 个答案:

答案 0 :(得分:1)

这是一个有趣的问题。

我可以为你提供一种hacky方式。它应该适用于DataTables 1.10.x。

附加以下事件处理程序,当DataTables向服务器端脚本发出Ajax请求时,将调用该处理程序。

调用另一个服务器端方法(在我的示例中为/echo/json/)并检索总记录数。

然后使用一些内部未记录的函数更新DataTables。

$('#example').on('xhr.dt', function ( e, settings, json, xhr ) {
   $.ajax({
      url: '/echo/json/',
      method: 'POST',
      data: { json: JSON.stringify({ recordsTotal: 999 }) },
      type: 'json'
   })
   .done(function(json){
      settings._iRecordsDisplay = json.recordsTotal;
      settings._iRecordsTotal = json.recordsTotal;     
      $.fn.dataTable.ext.internal._fnCallbackFire( settings, 'aoDrawCallback', 'draw', [settings] );
   });
});

请参阅this example以获取代码和演示。