如何使用jquery觸發dataTable搜索窗格的onclick事件？

Question

在 DataTables 中，有搜索窗格工具。 我想在頁面加載時觸發它。 過濾器應從 url 中通過的 arguments 中選擇。

我有代碼將從 URL 中提取過濾器的行值，它將 select 所有在 url 中傳遞的行都將突出顯示它不會應用的行，但它只是在過濾器中的實際選擇（和表的數據保持原樣）。

我的選擇行代碼如下所示：

if(str1 == str2) {
  $(this).addClass("selected");
  if(!$("#DataTables_Table_"+id+"_wrapper").hasClass('dtsp-selected')) {
    $("#DataTables_Table_"+id+"_wrapper").addClass('dtsp-selected');
  }
}

這里“str1”是從 url 傳遞的字符串，“str2”是在 searchpanes 表中匹配的字符串。 “id”是搜索窗格表的 id。 通過使用此代碼，可以選擇正確的行，但未應用實際過濾器。

我正在尋找一個觸發事件，該事件將在添加 select class 后應用過濾器。

Answer 1

在 DataTables 中， SearchPanes擴展在后台使用Select擴展來管理過濾器值的選擇。 事實上，每個搜索窗格本身就是一個使用Select擴展名的 DataTable 實例。 當您直接添加 DataTable 特定的類 ( dtsp-selected ) 以以編程方式觸發過濾時，實際上是短路了 DataTable 的Select擴展，您應該改為使用它的 API （請參閱此處的一般文檔）。

因此，您需要首先獲取窗格的 DataTable 實例。 它會是這樣的：

var panes = document.querySelectorAll('.dtsp-searchPanes table.dataTable');
var pane1DataTable = $(panes[0]).DataTable();

您現在可以利用 rows().every() 方法（請參閱此處的方法文檔）來遍歷窗格行。 一旦您到達您想要 select 的特定行，請使用row().select()方法（請參閱此處的方法文檔），因此您會得到如下內容：

pane1DataTable.rows().every( function ( rowIdx, tableLoop, rowLoop ) {
    // here the context is the row
    // perform you logic to check if the row must be selected then:
    this.select();
} );