无法在datatable的drawCallback()中以编程方式选择行

Unable to select rows programatically in drawCallback() of DataTables

本文关键字：编程 方式 选择 datatable drawCallback      更新时间：2023-09-26

我正在使用具有选择扩展的最新数据表。我试图在表呈现后以编程方式选择多行。我试图在drawCallback()中实现这一点，如下所示:

var table = $('#example').DataTable({
    "select": {
      "style": 'multi'
    },
    "columns": [
      { "data": "name" },
      { "data": "position" },
      { "data": "office" },
      { "data": "age" },
      { "data": "start_date" },
      { "data": "salary" }
    ],
    "rowId": "name",
    "drawCallback": function( settings ) {
      var api = new $.fn.dataTable.Api( settings );
      api.rows(["[id='Bradley Greer']", "[id='Ashton Cox']"]).select();
    }
 });

但是，我得到一个Uncaught TypeError: Cannot read property 'style' of undefined错误。

这是实时版本的链接- http://live.datatables.net/yemiqafu/2/

p。S:我使用[id='Bradley Greer']作为选择器，因为id中有一个空格。我必须在现场演示中这样做，这不是抛出错误的原因。

<

解决方案/strong>

选项drawCallback不是执行行选择的正确位置。

理想情况下，你应该使用initComplete选项代替，但是有一个问题与选择扩展，这是修复10/7/15阻止选择工作在initComplete。在此之前，你可以使用下面的解决方法来处理HTML来源的数据，或者使用每晚构建的数据表和Select扩展。

对于HTML数据源的表，可以在初始化后选择行。

var table = $('#example').DataTable({
    "select": {
      "style": 'multi'
    },
    "columns": [
      { "data": "name" },
      { "data": "position" },
      { "data": "office" },
      { "data": "age" },
      { "data": "start_date" },
      { "data": "salary" }
    ],
    "rowId": "name"       
});
table.rows(["[id='Bradley Greer']", "[id='Ashton Cox']"]).select();

请参阅此示例，以获取使用HTML源数据的表的解决方案的代码和演示。

请参阅这个示例，以获取使用每晚JS/CSS构建带有Ajax源数据的表的代码和演示。这个例子也可以用于HTML源数据

相关文章：