CODEWITHSUNDEEP
jquery
GustyWind
GustyWind

Reputation: 3036

how to iterate through select element in each row for conditional checking

My page has many rows and each row has a select element as shown.

<tr><td>row1</td><td><select name='action_select1'></td></tr>
<tr><td>row1</td><td><select name='action_select1'></td></tr>
<tr><td>row1</td><td><select name='action_select1'></td></tr>
<tr><td>row1</td><td><select name='action_select1'></td></tr>

....

Now I have to conditionally append option values for each select item but when i am iterating it, throws error cannot append element on object.

 var algSelect=grid.find('select[name=action_col1]');
    var array_sort = [{ name:'None', value:'none'},{name:'Source', value:'source'},{name:'Calculations', value:'calc'}];
    var temp_obj=[];
    for(var k; k<=algSelect.length;k++){
        temp_obj=algSelect[k];
        _.each(array_sort, function(gen) {
           if(some_cond_here)
            temp_obj.append('<option value="' + gen.value +'" title="'+gen.name+'">' + gen.name + '</option>');
        });
    }

How do i conditionally add options for each select Item.

Upvotes: 0

Views: 87

Answers (1)

LeGEC
LeGEC

Reputation: 51988

$('select[name="action_col1"]') will return a jQuery object - which has all of jQuery's methods : .append(), .css(), .val() ...

algSelect[k], on the other hand, will return a bare DOM node. If you want to manipulate it using jQuery's API, you need to wrap it again inside a $(...).

Try replacing :

temp_obj.append ...

with :

$(temp_obj).append

Actually, .append also works on a collection of nodes. If you can factor out your conditions :

var algSelect=grid.find('select[name=action_col1]');
var filtered = algSelect.filter(function(){  return some_cond_there; });

filtered.append('<option>'...'</option>');

Upvotes: 1

Related Questions