使用jQuery更新表格后，DataTables fnFilter无法正常工作

Question

我将DataTables jQuery库用于项目中的表。

为了自定义过滤，我在每行的第一列中添加了带有过滤词的span标签。 例：

<span style="display:none;" id="spanFilter' + i + '">filterWord</span>

然后，我使用select过滤这些单词。

$("#filterSelect").on('change', function () {
    oTable.fnFilter($("#filterSelect option:selected").val(), 0);
});

这很好。

我也有代码来更改#spanFilter的#spanFilter 。

$("#spanFilter" + i).text(spanFilterValue);

用jQuery更改filterWord后， fnFilter无法正常工作。

我究竟做错了什么？

Answer 1

通过查看代码，我相信您正在使用dataTables旧版本 。 如果您刚开始使用dataTables，我强烈建议您使用最新版本。

无论如何，为了反映在dataTables中，我强烈建议您使用dataTables api更改表的内容，而不是使用jQuery。

注意：以下示例适用于DataTables v1.9

$(document).ready( function () {

  var oTable = $('#table').dataTable();

  // get an array of the TR nodes that are used in table's body
  var nNodes = oTable.fnGetNodes();

  // iterating over each TR or row
  nNodes.forEach(function(node,index) {

    // update first column of every node
    oTable.fnUpdate(spanFilterValue,node,0);

  });

});

API参考

• fnGetNodes
• fn更新