爲DataTables創建自定義搜索框JQuery插件

所以標題說我試圖爲DataTables JQuery插件創建我自己的搜索框，因爲默認位置不適用於我，也沒有DOM配置，原因我正試圖將它放在表格的一行中用於顯示目的。爲DataTables創建自定義搜索框JQuery插件

我有這個網站位：

<th>Search by plan name and number :<br><input type="text" id="searchbox"></th>

和初始化數據表我有

<script> 
$(document).ready(function() { 
    var dataTable = $('#table_id').DataTable({ 
     "dom": '<"top"f>rt<"bottom"lp>' //adjust the locations of defaults 
    }); 

    // Custom search box 
    $("#searchbox").keyup(function() { 
    dataTable.fnFilter(this.value); 
    }); 
}); 
</script>

，最後在CSS我加入此位，刪除默認腳本搜索框：

.dataTables_filter { 
    display: none; 
}

但是，無論何時我輸入我的自定義框中沒有任何反應。任何建議或指導如何編輯？我也試圖調整頁面選擇器的位置和「顯示＃出＃」信息位，所以如果有人知道如何移動/重新創建其他地方（可能與搜索欄相同的方式））然後請隨意分享。謝謝！

來源

2016-06-30 FirstOrderKylo

我發現了一些修復它的代碼！原來我原來的腳本是不正確的，這應該是這樣的：

<script> 
     $(document).ready(function() { 
      var dataTable = $('#table_id').DataTable({ 
       "dom": '<"top"f>rt<"bottom"lp>' //adjust the locations of defaults 
      }); 

      // Custom search bar - **THIS IS WHAT CHANGED** 
      $('#searchbox').keyup(function(){ 
       dataTable.search($(this).val()).draw() ; 
      }) 
     }); 
</script>

來源

2016-06-30 05:52:56 FirstOrderKylo

爲DataTables創建自定義搜索框JQuery插件

回答

相關問題