Question

I have multiple select field each with multiple options.
So, by using jquery to get the respective selected options content, I would be able to get the selected option content. However, this work for the first select field. But, does not work for others. Others keep referencing the first select field selected options content, instead of it owns. Please guide me! Thanks!

My Select fields

<select id="resource_dd" name="resource_dd">
    <option selected="selected" value="nil1">No resources.</option>
    <option value="1">Week1</option>
    <option value="2">Resource1</option>
</select>


<select id="module_dd" name="module_dd">
    <option selected="selected" value="nil2">No restriction.</option>
    <option value="1">IT1234</option>
    <option value="2">IT2345</option>
</select>

Jquery to retrieve the selected content.

$("#module_dd").change(function ( event ) {
    var option = $("this").children();
    var module_id = $(option+":selected").val(); //module_id get 'nil1' as content instead of nil2

});

Answer 1

Just try this, it will give you the selected value.

$("#module_dd").change(function ( event ) {
  var module_id = $(this).val(); 
});