jQuery数据表使用特定类过滤行

Question

我正在开发一个jQuery Datatable项目，该项目需要根据特定的行类过滤数据。我要根据条件在创建行时向行中添加类。我正在尝试为用户提供一种单击按钮的方式，该按钮将应用仅显示包含特定类的行的过滤器。

我尝试了几种不同的解决方案，但似乎无法使其工作。有人知道如何正确执行此操作吗？

这是JSFiddle

$('#table').DataTable({
data: data,
columns: [
    { 
        "data": "item1",                      
        "render": function ( data, type, row ) {
            if(type === 'display'){
                return "<span class='format1'>"+data+"</span>";
            }else if(type === 'sort'){
                return data;
            }else if(type === 'filter'){
                return data;
            }else{
                return data;
            }
        }
    },
    { 
        "data": "item2",                      
        "render": function ( data, type, row ) {
            if(type === 'display'){
                return "<span class='format2'>"+data+"</span>";
            }else if(type === 'sort'){
                return data;
            }else if(type === 'filter'){
                return data;
            }else{
                return data;
            }
        }
    }   
],
createdRow: function ( row, data, index ) {
    if (data.item2 == 'this is item 2 - meets condition1') {
        $(row).addClass('condition1');
    }
    if (data.item2 == 'this is item 2 - meets condition2') {
        $(row).addClass('condition2');
    }
}
});

$('#btn-filter').on('click',function(){
    //// only show table data that contains the class condition1
});
$('#btn-undo').on('click',function(){
    //// remove the filter that was applied with btn-filter
});

Answer 1

工作提琴。

您可以使用：

$.fn.dataTable.ext.search.push(
   function(settings, data, dataIndex) {
       return $(table.row(dataIndex).node()).hasClass('condition1');
   }
);

要过滤表格，然后重置它，只需使用：

$.fn.dataTable.ext.search.pop();

请注意，您应该在两个actios之后重新绘制。

希望这可以帮助。

$.fn.dataTable.ext.search.push(
   function(settings, data, dataIndex) {
       return $(table.row(dataIndex).node()).hasClass('condition1');
   }
);

$.fn.dataTable.ext.search.pop();