Jquery-DataTables 捕获搜索事件，但不捕获来自排序的事件

Question

我正在渲染 Jquery DataTables 表中的数据图表，并希望在 UI 搜索中的表内容发生更改或调用如下搜索时触发一个函数以重新绘制图表

$('#mytable').DataTable().column(0).search('my value').draw()

在我的桌子上我有以下代码

var table = $('#mytable').DataTable({
    //my settings here
}).on( 'search.dt',   function () { updateGraph( GraphData ) ; } );

代码正在运行，但在排序事件上，例如对列排序，触发搜索后跟排序事件。有没有办法只在表格内容发生变化时才触发变化？

请参阅此示例以获取更多信息。 https://datatables.net/examples/advanced_init/dt_events.html

Answer 1

这是一个很好的收获！从未意识到即使在简单订购时也会触发search.dt 事件。其实是个奇葩问题。也许其他人会想出一个更好的主意，但我认为保留当前行的“快照”并将它们与触发search.dt 时的行进行比较可以解决问题。如果snapshot 是基于表行的默认顺序，或者index，而不是应用的顺序，那么当且仅当dataTable 中的数据实际发生变化时，我们才能触发datachange.dt 事件：

var table = $('#example').DataTable({
   snapshot: null
})
.on('search.dt', function() {
  var snapshot = table
     .rows({ search: 'applied', order: 'index'})
     .data()
     .toArray()
     .toString();

  var currentSnapshot = table.settings().init().snapshot;

  if (currentSnapshot != snapshot) {
   table.settings().init().snapshot = snapshot;
   if (currentSnapshot != null) $('#example').trigger('datachange.dt')
  }
})
.on('datachange.dt', function() {
  alert('data has changed')
  //updateGraph( GraphData )
})

演示 -> http://jsfiddle.net/hftuew5u/