Only Bolivian Here Only Bolivian Here - 5 months ago 7
jQuery Question

How to get an array of all selected values of all dropdownlists in div

Here's what I'm trying to parse with jQuery:

<tr>
<td>5</td>
<td>abc@abc.com</td>
<td>asdfasdf asdfasdf</td>
<td>
<div class="roleoption">
<img src="/Public/images/delete.png" alt="delete" />
<select id="role" name="role">
<option value="1">Anonimo</option>
<option value="2">Registrado</option>
<option value="3">Tecnico</option>
<option value="4">Empresario</option>
<option selected="selected" value="5">Editor</option>
<option value="6">Financias</option>
<option value="7">Administrador</option>
</select>
</div>
<img class="add-role" src="/Public/images/add.png" alt="add" />
</td>
</tr>


And the javascript code:

select td tr get the first td's value?
var userId = $(this).parent().parent().select


That's just for getting the user id, I can't seem to figure out how to select elements.

Then I need to grab each .val() of every
select
inside the td. Something like:

$(this).parent().find('select').each().val();??


How can I wrap this code up and return something like:

//Save array of values: { user: 4, roles { rol: 1, rol: 3, rol: 6 } }


I intend to use this array of values in an ajax request.

Answer

You could do something like this:

var selectValues = new Array();
$('div.roleoption').find('select').each(function() {
    selectValues.push($(this).val());
}

There's probably a much better way of doing the same thing in jQuery, but that should work.