无法在 DataTables 的 drawCallback() 中以编程方式 select 行

Question

我正在使用扩展名为 select 的最新数据table。在呈现 table 之后，我试图以编程方式 select 多行。我正在尝试在 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 错误。

这是现场版的 link - http://live.datatables.net/yemiqafu/2/

P.S: 我用 [id='Bradley Greer'] 作为 select 或者因为在 id 中有一个 space。我必须为现场演示执行此操作，这不是引发错误的原因。

Answer 1

SOLUTION

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

理想情况下，您应该使用 initComplete option instead, but there was an issue with Select extension that was fixed 10/7/15 which prevented Select to work in initComplete. Until then you can use the workaround below for HTML sourced data or use nightly build DataTables 和 Select 扩展。

对于来自 HTML 源的数据的 table，您可以在 DataTables 初始化后 select 您的行。

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();

DEMO

请参阅 this example，了解使用 HTML 来源数据的 table 解决方法的代码和演示。

请参阅 this example，了解使用 JS/CSS 夜间构建 table 和 Ajax 源数据的代码和演示。此示例也可用于 HTML 源数据。

无法在 DataTables 的 drawCallback() 中以编程方式 select 行

Unable to select rows programatically in drawCallback() of DataTables

javascript

datatable

jquery