jQuery数据表-删除fnFilter并显示所有结果

2021/01/06 14:11 · jquery ·  · 0评论

我目前有一个数据表,该数据表的每个记录都有一个按钮,单击该按钮可显示该帐户的其他信息。发生这种情况时,我调用fnFilter()来过滤该特定行,以便不显示其他行,并且用户知道我显示的子信息是针对该特定帐户的。我想做的是,当用户在搜索工具栏中单击时,它会隐藏我显示的子信息,然后清除过滤器并显示所有可用的原始记录。一切正常,除了不清除过滤器,因此仅显示最初选择的行。

不知道我在想什么。我已经尝试了从使用fnFilter('')到fnDraw()到fnReloadAjax()的所有内容。这些(或任何组合)似乎都不起作用!

更新我似乎已经隔离了问题。如果我从fnFilter(accountid,7)中删除列#,则使用fnFilter('')会重新显示所有记录。但是,我确实需要按该特定列进行过滤,因为它是唯一包含每个记录的唯一值的列。有任何想法吗?我确实尝试使用fnFilter('',null)但没有成功。

这是我的代码:

var oTable = $('.mypbhs_accounts').dataTable({
        "bProcessing": true,
        "sAjaxSource": 'sql/mypbhs_accounts.php',      
        "aaSorting": [[1, "asc" ]],
        "bJQueryUI": true,
        "sPaginationType": "full_numbers",
        //"bStateSave": true, //Use a cookie to save current display of items
        "aoColumns": [
            {"asSorting": [  ], "sClass":"center"},
            null,
            null,
            null,
            null,
            null,
            null,
            { "bSearchable": true, "bVisible": false },       
            { "bSearchable": true, "bVisible": false }       
        ],
        "bScrollCollapse": true,
        "sScrollX": "100%",
         "fnInitComplete": function() {
                oTable.fnAdjustColumnSizing();
         }
    });
/*** CLEAR CURRENT ACCOUNT INFO ***/
$(document).on('click','.mypbhs_content .dataTables_filter',function(){ //THIS IS CALLED WHEN USER CLICKS INTO THE SEARCH BAR
    $('.mypbhs_content .dataTables_filter :input').val(''); //CLEAR CURRENT VALUE IN THE SEARCH BAR
    oTable.fnFilter('');
    //oTable.fnDraw();
    //oTable.fnReloadAjax();
    $('.mypbhs_truform_info').empty(); //REMOVE SUB-INFORMATION SO IT DOESNT GET ASSOCIATED WITH WRONG ACCOUNT
    $('.control_bar').children('ul.mypbhs_account_controls').empty();
});

嗯,我似乎已经知道了。必须清除该特定列上的过滤器和全局过滤器:

oTable.fnFilter('',7);
oTable.fnFilter('');

使用数据表> 1.10清除所有过滤器很简单:

oTable.search( '' ).columns().search( '' ).draw();

对我来说,这个插件很棒:

https://datatables.net/plug-ins/api/fnFilterClear

在Datatables v1.10上

$('.dataTables_filter input[type=search]').val(''); 

做到这一点(清除搜索框)

"sPaginationType" : "bootstrap",
"iDisplayLength": 25,
"aLengthMenu": [[25, 50, 100, -1], [25, 50, 100, "All"]],
"bStateSave" : false,

如果您要保存搜索结果,请提及

"sPaginationType" : "bootstrap",
"iDisplayLength": 25,
"aLengthMenu": [[25, 50, 100, -1], [25, 50, 100, "All"]],
"bStateSave" : true,
本文地址:http://jquery.askforanswer.com/jqueryshujubiao-shanchufnfilterbingxianshisuoyoujieguo.html
文章标签: ,   ,  
版权声明:本文为原创文章,版权归 admin 所有,欢迎分享本文,转载请保留出处!

文件下载

老薛主机终身7折优惠码boke112

上一篇:
下一篇:

评论已关闭!