Question

我有一个显示注册用户的表，可以根据状态（活动/非活动用户或两者）或用户类型（管理员/用户或两者）过滤此表的行。为了确保根据两个条件筛选所有表行，我让PHP为每个表行生成'info'属性。信息可以是四件事之一：

Active Admin
活跃用户
非活动管理员
非活动用户

这样可以根据在两个过滤器下拉列表中选择的选项轻松过滤掉用户行。

我想弄清楚的是当为其中一个过滤器下拉列表选择两者时如何过滤它们 - 我知道有一种更有效的方法来执行此操作而不是运行六个每次下调其中一个下拉列表时返回if语句。

这是我的代码：

function toggleAll(){
    var selectedString = $('#userStatusDropDown').val() + ' ' + $('#userTypeDropDown').val();
    switch (selectedString){
        case 'Both Both':
            $('#tableUsers tr').show();
            break;

        default:
            $('#tableUsers tr:gt(1)').hide();
            $('#tableUsers tr[info="'+selectedString+'"]').show();
    }
}


$(document).ready(function(){   
        toggleAll();

        // admin/user drop down changes
        $('#userTypeDropDown').change(function(){
            toggleAll();
        });

        // active/inactive drop down changed
        $('#userStatusDropDown').change(function(){
            toggleAll();
        });
});

Answer 1

结束这一点，并没有像我想象的那样草率：

function toggleAll(){
    var selectedString = $('#userStatusDropDown').val() + ' ' + $('#userTypeDropDown').val();
    switch (selectedString){
        case 'Both Both':
            $('#tableUsers tr').show();
            break;

        case 'Both Admin':
            $('#tableUsers tr:gt(1)').hide();
            $('#tableUsers tr[info="Active Admin"]').show();
            $('#tableUsers tr[info="Inactive Admin"]').show();
            break;

        case 'Both User':
            $('#tableUsers tr:gt(1)').hide();
            $('#tableUsers tr[info="Active User"]').show();
            $('#tableUsers tr[info="Inactive User"]').show();
            break;

        case 'Active Both':
            $('#tableUsers tr:gt(1)').hide();
            $('#tableUsers tr[info="Active User"]').show();
            $('#tableUsers tr[info="Active Admin"]').show();
            break;

        case 'Inactive Both':
            $('#tableUsers tr:gt(1)').hide();
            $('#tableUsers tr[info="Inactive User"]').show();
            $('#tableUsers tr[info="Inactive Admin"]').show();
            break;

        default:
            $('#tableUsers tr:gt(1)').hide();
            $('#tableUsers tr[info="'+selectedString+'"]').show();
    }
}

使用Jquery过滤表行

1 个答案: