Question

我的页面上有三个数据表：

<table class="driving-table">
  -- table #1--
</table>
<table class="driving-table">
  -- table #2--
</table>
<table class="driving-table">
  -- table #3--
</table>

这是我用来初始化表格的JS：

var table = $('table.driving-table').DataTable({
    rowReorder: true,
    dom: 'Bfrtip',
    "bFilter": true,
    buttons: [
        'copyHtml5', 'excelHtml5', 'pdfHtml5', 'print'
    ],
    "paging":   false, //Hide the "Show entries" and "Paging"
    "bInfo": false                  
});

//Searching:
$('#top_search').on( 'keyup', function () {
        table.search( this.value ).draw();
});

但是，使用上面的内容，我只能在表＃3上获得search输入。同样适用于buttons

显示问题的

Here is a jsFiddle 。

如您所见，只有底部表格是可搜索的，只有底部表格按钮放在.button-holder中。

我做错了什么？

Answer 1

您可以使用tables() API方法，如下所示：

$('#top_search').on( 'keyup', function () {
   table.tables().search( this.value ).draw();
});

table.tables().buttons().container()
   .appendTo( '.button-holder' );

请参阅updated jsFiddle以获取代码和演示。

datatable - 同一页面上的多个表，但只有一个表正在响应

1 个答案: