Showing/hiding rows of a table based on two elements
<p>I have two functions, toggleUserTypeRows() and toggleRows(). Each function is for hiding/showing rows of a table based on either if the user is a user or an admin (toggleUserTypeRows()) or if the user is active or inactive (toggleRows()). Both of them are working on their own, but I'm trying to get them so that they work together--right now they cancel each other out, say if I filter the rows so that only admin accounts are visible and then try and filter out only active users, the list will now show active users that are admins or normal users. </p>

<p>I know ways of going about doing this but I'm not so great when it comes to coding efficiently... I know there's a better way of doing this than sticking a mess of if statements within my switch cases. So what I'm looking for is some good ideas of how to go about this without my usual million lines of code. </p>

<p>Functions:</p>

<pre><code>function toggleUserTypeRows(){
    var selected = $('#userTypeDropDown').val();
    switch (selected){
        case 'User':
            $('table tr[userType="user"]').show();
            $('table tr[userType="admin"]').hide();
            break;

    case 'Admin':
        $('table tr[userType="admin"]').show();
        $('table tr[userType="user"]').hide();
        break;

    default:
        $('table tr[userType="admin"]').show();
        $('table tr[userType="user"]').show();
}
// color every other row
$('#tableUsers tr').removeClass('altr').filter(':odd').addClass('altr');
}

function toggleRows(){
var selected = $('#userStatusDropDown').val();

switch (selected){
    case 'Active':
        var $rows = $('.userActive');
        $rows.show();
        $('.userInactive').hide();
        break;

    case 'Inactive':
        var $rows = $('.userInactive');
        $rows.show();
        $('.userActive').hide();
        break;

    default:
        var $rows = $('#tableUsers tr');
        $rows.show();
}
 // color every other row
 $rows.removeClass('altr').filter(':odd').addClass('altr');
}
</code></pre>

<p>Drop-down change code:</p>

<pre><code>$(document).ready(function(){

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

    // active/inactive drop down changed
    $('#userStatusDropDown').change(function(){
        toggleRows();
    });
 });
</code></pre>
