Question

我使用JQUERY Datatable插件呈现了一个表。我试图通过此代码向表中添加新行

var oTable = $('#table_question').DataTable();
oTable.row.add(['', '', '']);

但是当新行被插入时，它的行中每个TD都没有任何类。所以我需要将类 col-1 添加到第一列，将 col-2 添加到第二列。如何在添加自身时指定此类？另外，在通过 row.add

添加新行时，如何为每个单元格提供任何特定模板？

Answer 1

要在新添加的行中向不同列/ <td>添加不同的类，请按<td>访问每个column(<index>).nodes().to$()作为jQuery实例：

var row = table.row.add(['someValue', 'someOtherValue']);
table.row(row).column(0).nodes().to$().addClass('testClass1');
table.row(row).column(1).nodes().to$().addClass('testClass2');
table.row(row).draw();

带有按钮和弹出窗口的演示，用户可以动态添加新行，并为每个<td>添加不同的CSS类 - ＆gt;的 http://jsfiddle.net/3vp55tgh/

Answer 2

正常缓存新添加的row和addClass，如下所示：

var oTable = $('#table_question').DataTable();
var rowNode = oTable.row.add(['', '', '']);
$( rowNode ).addClass('anyclass');

以下是添加 single row 和 multiple rows <的文档/ p>

Answer 3

如果有成千上万的行通过AJAX来接受，则解决方案的运行速度非常慢（在我的情况下，这是自定义AJAX实现：前50行来自服务器，而下一行则循环装入-每批中有50行）。

以下解决方案对我很有帮助：

var table = $('#tableID').DataTable({
    'createdRow': function (row, data, dataIndex) {
         //no jQuery, just native JS to ensure fast
         row.children[0].classList.add("col-md-1");
         row.children[1].classList.add("col-md-3");
         row.children[2].classList.add("col-md-2");
     }
});

在JQUERY数据表中为新插入的行指定TD类

3 个答案: