时间戳

首页 > 解决方案 > jquery：如何访问 createdRow() 回调中的底层 DataTable？

javascript - jquery：如何访问 createdRow() 回调中的底层 DataTable？

问题描述

创建行时，我想添加一个包含 , 的子行，以便以后通过++<table>填充。很简单。回调似乎是一个很好的地方......如果我能让它工作的话。on.click()DataTable()ajaxcreatedRow()

createdRow()接受 4 个参数，如下所示。

这些都不是数据表或子对象。不仅如此，我似乎没有办法了解底层<table>元素。既不$(row).closest('table')也不$(cells[0]).closest('table')似乎返回任何东西，$(row).parent()也不起作用。似乎该行还没有插入到表中。

如果在调用时该行确实没有插入到表createdRow()中，那么我想我只需要使用另一个回调，例如initComplete()，并遍历行。但是createdRow()会很完美，因为所有数据都在 args 中，所以我希望我只是缺少一些简单的东西并且createdRow()可以工作。

谢谢！

标签： javascriptjquerydatatable

解决方案

您可以使用此处显示的方法之一从表本身访问表的 API 对象。所以，例如，

$('#your_table_id_here').DataTable()

有了这个，您可以执行以下操作来创建子行：

$('#example').DataTable( {
  "createdRow": function( row, data, dataIndex, cells ) {
    var myTable = $('#example').DataTable();
    myTable.row( dataIndex ).child( '<table><tr><td>some data</td></tr></table>' ).show();
  }
} );

这基本上使用row()带有行索引号的 API 调用来获取作为 DataTables 对象（而不是<tr>元素）的行。

如果您通过 DataTables API 添加新行row.add()，那么您可以使用从该函数返回的行对象，而无需创建 DataTable 的 API 的新实例：

var row = table.row.add( ['John Doe', 'more info', ...] ).draw();
row.child( '<table><tr><td>some data</td></tr></table>' ).show();

上面的示例假定这table是创建 DataTable 时分配给 DataTable 的变量：

var table = $('#example').DataTable( {
   // your usual DataTable options here
} );

将子项添加到行通常在最初呈现表格时完成，而不使用该createdRow选项。我认为这是处理诸如打开/关闭按钮（如果你想要的话）之类的最简单的方法。

有关无法访问 HTML 表 ID 的评论的更新。

在createdRow回调函数中，您也可以将this其用作选择器：var myTable = $( this ).DataTable();. 在这种情况下，不需要知道表的 ID。

使用它，我之前的示例变为以下内容：

$('#example').DataTable( {
  "createdRow": function( row, data, dataIndex, cells ) {
    var myTable = $( this ).DataTable();
    myTable.row( dataIndex ).child( '<table><tr><td>some data</td></tr></table>' ).show();
  }
} );

推荐阅读