Can't get an array using attribute selectors

Question

I'd like to toggle the visibility of certain rows in a table based on the value of a drop-down box. I already have classes for each of the rows, so I decided to add userType as an attribute (which is generated by PHP) to the <tr>'s. However, when I use the same function I used for toggling the visibility of the rows using their class selectors, it doesn't work with $('tr[userType="User"]');. I've searched around for why this selector isn't returning the right array, but haven't had any luck. Any help would be much appreciated.

Function:

function toggleUserTypeRows(){
    var selected = $('#userTypeDropDown').val();
    switch (selected){
        case 'User':
            var $rows = $('tr[userType="User"]');
            $rows.show();
            $('tr[userType="Admin"]').hide();
            break;

        case 'Admin':
            var $rows = $('tr[userType="Admin"]');
            $rows.show();
            $('tr[userType="User"]').hide();
            break;
        default:
            var $rows = $('#tableUsers tr');
            $rows.show();
    }
}

Isn't it possible that jQuery interprets [userType] as <tr user-type=""> ? — biziclop
– biziclop, Commented Oct 18, 2011 at 20:20

VajNyiaj · Accepted Answer · 2011-10-18 20:32:52Z

1

<table>
    <tr userType="Admin"><td>Row 1</td></tr>
    <tr userType="User"><td>Row 2</td></tr>  
    <tr userType="Admin"><td>Row 3</td></tr>
    <tr userType="User"><td>Row 4</td></tr>     
 </table>


<select>
    <option value="User">User</option>
    <option value="Admin">Admin</option>
</select>

<script type="text/javascript">

$('select').change(function(e){
    var userType = $(this).val();
    $('table tr').show();
    $('table tr[userType="'+ userType +'"]').hide();
});

</script>

answered Oct 18, 2011 at 20:32

VajNyiaj

1,9302 gold badges12 silver badges15 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Naftali · Accepted Answer · 2011-10-18 20:18:19Z

1

Use filter()

For example:

     case 'User':
        var $rows = $('tr').filter(function(){
             return $(this).attr('userType') == 'User';
        });
        ...

answered Oct 18, 2011 at 20:18

Naftali

147k41 gold badges247 silver badges304 bronze badges

Collectives™ on Stack Overflow

Can't get an array using attribute selectors

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related