数据表中的自定义列过滤器

Question

我有一个包含 15 列的数据表。我正在使用下面的过滤器脚本，它显示组合框中的所有值。它显示所有列的组合框过滤器。但实际上我不需要它。我想要它用于2,4,5,6,12 Columns。我正在使用DataTables 1.10.16。

$("#dTable tfoot th").each( function ( i ) {

        if ($(this).text() !== '') {
            var isStatusColumn = (($(this).text() == 'Status') ? true : false);
            var select = $('<select><option value=""></option></select>')
                .appendTo( $(this).empty() )
                .on( 'change', function () {
                    var val = $(this).val();

                    table.column( i )
                        .search( val ? '^'+$(this).val()+'$' : val, true, false )
                        .draw();
                } );

            if (isStatusColumn) {
                var statusItems = [];


                table.column( i ).nodes().to$().each( function(d, j){
                    var thisStatus = $(j).attr("data-filter");
                    if($.inArray(thisStatus, statusItems) === -1) statusItems.push(thisStatus);
                } );

                statusItems.sort();

                $.each( statusItems, function(i, item){
                    select.append( '<option value="'+item+'">'+item+'</option>' );
                });

            }

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


[![Actuall View of the table now][1]][1]


[![I want like this][2]][2]


  [1]: https://i.stack.imgur.com/gVZiR.png
  [2]: https://i.stack.imgur.com/fqGWI.png

Answer 1

您可以为每个选择添加一个动态类，然后使用 CSS 显示：无。

var select = $('<select class="' + i + '"><option value=""></option></select>')

那么……

.variableName1,
.variableName5,
.variableName6,
.variableName7,
.variableName8,
.variableName9 {
    display:none;
}