javascript - DataTables 筛选器选择相差一个

Question

我正在使用 jquery DataTables用于整理表格的库，并且在过滤选择出现在错误位置时遇到了一些问题。

问题是我在 th 元素上使用 'filter' 类来指定是否应过滤列。但是，如果我跳过一列，其余的就会乱序。

因此在下面(使用 DataTables 示例数据)and in this jsFiddle , Position 没有过滤，而 Name, Office 和 Age 是，但是，Office 上面的 select 有 Positions，Age 上面的 select 有 Offices。

下面是我使用的有问题的代码，但它是 heavily based on the DataTables filtering example如果我跳过一个，我似乎无法让选择正确排列。

var table = $('#nhpaCompare').DataTable({
    "paging": false,
    "columnDefs": [ {
        "targets": noOrdering ,
        "orderable": false // defined elsewhere
    } ]

});

$("#nhpaCompare thead tr th.filter").each( function ( i ) {

    var select = $('<select><option value=""></option></select>')
        .appendTo( $(this).empty() )
        .on( 'change', function () {
            table.column( i )
                .search( ''+$(this).val()+'')
                .draw();
        } );

    table.column( i ).data().unique().sort().each( function ( d, j ) {
        select.append( '<option value="'+d+'">'+d+'</option>' )
    } );

} );

Answer 1

你需要添加一个 if 条件来检查它是否有类过滤器和 jQuery 会像

$("#nhpaCompare thead tr:first th").each( function ( i ) {

    if ($(this).hasClass("filter")) {       
        var select = $('<select><option value=""></option></select>')
            .appendTo( $(this).empty() )
            .on( 'change', function () {
                table.column( i )
                    .search( ''+$(this).val()+'')
                    .draw();
            } );

        table.column( i ).data().unique().sort().each( function ( d, j ) {
            select.append( '<option value="'+d+'">'+d+'</option>' )
        } );
    }
    } );

Demo