是否可以自定義Jquery Data Table默認生成的dom結構？

我正在使用在http://datatables.net/api找到的Jquery數據表插件。該插件生成它自己的搜索框，如果啓用，它會在初始化時插入頁面。當創建一個搜索框，它嵌套在它自己的DIV像這樣：是否可以自定義Jquery Data Table默認生成的dom結構？

<div> 
    <!-- search code --> 
</div> 
<table> 
    <!-- table data --> 
</table>

我想對錶的滾動條，而無需移動搜索框，所以它總是可見。溢出-Y：滾動;似乎不適用於我的表格元素，但在div上工作。是對的嗎？如果我將樣式應用於父容器，那麼如果用戶向下滾動，搜索框將不可見。我試着自己身體移動元素所需的設定是：

<div> 
    <!-- Search Code --> 
</div> 
<div style="overflow-y:scroll;"> <!-- actually in a class but this shows what it is. --> 
    <table> 
     <!-- table data --> 
    </table> 
</div>

正如所預料的，打破了插件生成的搜索框。所以我的問題是，我可以使用插件的內置搜索功能實現期望的結果，也許使用像'sdom'這樣的參數，或者我需要咬住子彈並滾動我自己的搜索/過濾器功能？

來源

2013-02-12 Nickel

這可能聽起來很傻，但爲什麼不乾脆用分頁元素到數據表，結果限制爲10或20個頁面，然後就沒有必要滾動，這將消除這個問題。 – SQLGuru 2013-02-12 12:22:40

我的客戶已經特別要求滾動分頁，我已經和他們討論過了。我的偏好是尋呼，但不是我的偏好。你提出了一個非常有效的觀點，但不幸的是，在這種情況下我不能使用這一點。 – Nickel 2013-02-12 13:33:51

你有沒有試過在JQuery Datatables論壇發佈這個問題？ – SQLGuru 2013-02-13 06:11:59

我發現的解決方案只是關閉內置過濾器，並編寫我自己的等價物，以便放置在我喜歡的地方。

http://jsfiddle.net/KwXby/5/

$(document).ready(function(){ 
    $("#tableFilter").bind("change keyup", function(){ 
    var tableRows = $('.dataTable:visible').find('tbody').find('tr'); 
    var filterText = $(this).val(); 
    $(tableRows).each(function() { 
    if ($(this).text().indexOf(filterText) >= 0) { 
     $(this).show(); 
    } else { 
     $(this).hide(); 
    } 
    }); 
    }); 
});

編輯：後來我才發現，我需要能夠搜索到多個列與空格分隔搜索詞，並提供一個空錶行，如果沒有被發現，其必要的更新。

http://jsfiddle.net/KwXby/11/

來源

2013-09-27 09:13:29 Nickel

是否可以自定義Jquery Data Table默認生成的dom結構？

回答

相關問題