动态fnAddData时,DataTables显示"Processing ..."标签

Question

我有一个动态添加数据到DataTables的功能.这是功能.

function fnClickAddRow() {
    for (i=0; i<10000; i++) {
        $('#example').dataTable().fnAddData( [
         giCount+".1",
         giCount+".2",
         giCount+".3",
         giCount+".4" ]
        );
    }
}

这个函数会动态附加到我的#example数据表中,但是在操作过程中屏幕看起来很悬,有没有办法用"处理"来显示加载/处理符号:true,

Answer 1

没有通过API触发"处理"消息显示的功能,但有一种解决方法.

您需要启用处理指示符bProcessing: true(对于DataTables 1.9)或processing: true(对于DataTables 1.10).

要显示具有id的表的处理指示符example:

$('.dataTables_processing', $('#example').closest('.dataTables_wrapper')).show();

隐藏具有id的表的处理指示符example:

$('.dataTables_processing', $('#example').closest('.dataTables_wrapper')).hide();

另一件值得一提的是,由于某些原因,在我添加setTimeout100毫秒延迟之前,处理指示器才显示.

在旁注中,为了提高性能,您需要指定false第二个参数fnAddData()来指示不需要重新绘制.完成添加行后,可以调用fnDraw()重绘表,看看这个jsFiddle.

如果先将数据放入数组然后再调用fnAddData()一次,则可以进一步提高性能.

有关代码和演示,请参阅此jsFiddle.