jquery - jquery数据表下拉过滤器

标签 jquery datatables

这是我的代码:

$(document).ready(function() {
    /* Initialise the DataTable */
    var oTable = $('#example').dataTable({
        "oLanguage": {
            "sSearch": "Search all columns:"
        },
        "iDisplayLength": 10,
        "bJQueryUI": true,
        "sPaginationType": "full_numbers",
        "bFilter": true,
    }); 

    /* Add a select menu for each TH element in the table footer */
    $("thead th").each( function ( i ) {
        this.innerHTML = fnCreateSelect( oTable.fnGetColumnData(i) );
        $('select', this).change( function () {
            oTable.fnFilter( $(this).val(), i );
        } );
    } );        
} );

我使用 jquery datatables 插件,它的工作完美,就像这个例子:

http://www.datatables.net/release-datatables/examples/api/multi_filter_select.html

我想要做的是,我不想为每一列都有一个下拉列表,而是只希望在一个特定列上有一个下拉列表。

所以我想我需要改变:

$("thead th").each( function ( i ) {

但我不知道该放什么。任何帮助将不胜感激,提前致谢。

最佳答案

您还可以创建自己的选择列表并将其放置在表格外您喜欢的任何位置。

<select id="mySelect">
    <option value="">Select</option>
    <option value="1">1</option>
    ...
</select>

<script>
    $('#mySelect').on('change',function(){
        var selectedValue = $(this).val();
        oTable.fnFilter("^"+selectedValue+"$", 0, true); //Exact value, column, reg
    });
</script>

关于jquery - jquery数据表下拉过滤器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9616841/

相关文章:

javascript - 遍历 Div

jquery - Angular 1.3 和所需的最低 JQuery 版本

javascript - DataTables Symfony 中的无效 JSON 响应

javascript - 有没有一种简单的方法可以在 React.JS 中包含像 DataTables 这样的 jQuery UI 插件?

javascript - AJAX 请求太大?

javascript - 仅影响带有 JQuery 和 SLidedown() 函数的悬停 div 标记

javascript - 通过AJAX上传的二进制数据保存在PHP服务器上

javascript - jquery.dataTables.min.js :48 Uncaught TypeError: Cannot read property 'length' of undefined

mysql - 数据表 : Make a parallel request in another table using ServerSide

javascript - 从表头抓取列元素