Question

使用DataTables我想要做的是在列中有一个复选框，如果选中该框，那么该行将始终可见。搜索是最大的问题，如果我固定某些内容并搜索其他内容，固定行仍然应该保留，而其他所有内容都会被过滤掉。分页不是一个问题，因为我没有分页。

关于如何解决此问题的任何想法？

Answer 1

您可以通过覆盖搜索框触发的内置搜索来执行此操作。只需unbind()来自搜索框的事件，然后按custom filter执行您自己的搜索，除了正常的字符串比较，如果选中相应的行复选框，则返回true。

以下示例在第一列中有复选框：

$('.dataTables_filter input').unbind().bind('keyup', function() {
    var searchTerm = this.value.toLowerCase();
    $.fn.dataTable.ext.search.push( function( settings, data, dataIndex ) {
        //return true if checkbox is checked
        if (table.cells({ row:dataIndex, column:0 }).nodes().to$().find('input').is(':checked')) return true;
        //search normally by comparing content in each column with searchTerm
        for (var i=0;i<data.length;i++) {
            if (~data[i].toLowerCase().indexOf(searchTerm)) return true;
        }
        return false;
    })
    table.draw();
    $.fn.dataTable.ext.search.pop();
})

演示 - ＆gt;的 http://jsfiddle.net/sudpevLf/

数据表＆＃39;内置过滤是＆＃34;智能＆＃34;因为它打破了用户的注意力输入单个单词然后匹配任何单词位置和表中的任何顺序（而不是简单的做一个简单的字符串比较）。

可以复制为

$('.dataTables_filter input').unbind().bind('keyup', function() { var searchTerms = this.value.toLowerCase().split(' '); $.fn.dataTable.ext.search.push( function( settings, data, dataIndex ) { //return true if checkbox is checked if (table.cells({ row:dataIndex, column:0 }).nodes().to$().find('input').is(':checked')) return true; //search normally by comparing content in each row with searchTerm for (var s=0;s<searchTerms.length;s++) { for (var i=0;i<data.length;i++) { if (~data[i].toLowerCase().indexOf(searchTerms[s])) return true; } } return false; }) table.draw(); $.fn.dataTable.ext.search.pop(); })

尝试搜索＆＃34; cedric san＆＃34; - 与塞德里克和所有圣弗朗西斯科都返回两个名字。的 http://jsfiddle.net/sudpevLf/1/

数据表 - 行始终可见或不隐藏行或不搜索行或引脚行

1 个答案: