Getting selected value from multiple dropdowns

Question

If user change the entry from any dropdowns in the SalePlugin div then it will need to get all the selected value and pass it into POST.

How it should be done?

$('.SalePlugin > *').live('change', function(){
 var SalePluginData = $(this).closest('.SalePlugin').find('select').serialize();
 $.post(host + '/ajax/file.php', { Data: SalePluginData }, function(data){
            console.log(data);
 });
});

HTML

<div class='SalePlugin'> 
 <ul>
   <li> 
      <select name='something[]'> 
        <option value='one'>One</option>
        <option value='two'>Two</option>
      </select> 
    </li>
 </ul>
 <ul>
   <li> 
      <select name='something[]'> 
        <option value='one'>One</option>
        <option value='two'>Two</option>
      </select> 
    </li>
 </ul>
 <ul>
   <li> 
      <select name='foo[]'> 
        <option value='one'>One</option>
        <option value='two'>Two</option>
      </select> 
    </li>
 </ul>
</div>

Answer 1

To get the selected items in a dropdownlist use this

$(".SalePlugin option:selected");

this 'll get the selected items. You can store them in array or make a loop and do whatever you want.

for (var i = 0; i < $(".SalePlugin option:selected").length; i++) {
    values[i] = $($(".SalePlugin option:selected")[i]).attr('value');
}