DataTable JS插入问题

时间:2016-08-17 11:06:11

标签: javascript jquery performance datatables

我们使用DataTable.js来绑定网格。我们有大约数千条记录,所以最初我们绑定了500条记录,之后我们逐一插入它们。但是一个接一个地插入屏幕就冻结了。我们编写了用于逐个插入的JavaScript代码。

function bindLoadOverView() {
  $.ajax({
      type: "POST",
      contentType: "application/json; charset=utf-8",
      dataType: 'json',
      url: "../Loads/board.aspx/bindView",
      success: function(data1) {
        var aData = data1.d;
        for (var i = 500; i < aData.length; i++) {
          table.row.add([

            null,
            aData[i].row1,
            aData[i].row2
          ]).draw(false);
        }
      })
  });
}

1 个答案:

答案 0 :(得分:0)

首先,在您的dataTable初始化中将deferRender设置为true。这将阻止dataTable在不需要时执行某些慢速DOM操作。 同样请在每个draw()之后跳过add(),这完全是多余的。

为防止阻止您的网页/其他脚本,您可以使用interval插入行。我知道你只想静静地在后台插入剩余的行。在插入行时,使用间隔将为其他线程提供处理空间。示例:

var index = 500,
    max =  aData.length,
    insert = window.setInterval(function() {

      table.row.add([
         null,
         aData[i].row1,
         aData[i].row2
      ])

      index++
      if (index == max) window.clearInterval(insert)

    }, 20) 

之后你可以draw()表格,如果由于某种原因需要或者必要的话。