Jquery detect when user uses SELECT element in form

Question

Hello,

I want to be able to detect when the user has selected an option from a SELECT element in a form. I know what to do from there, but not sure about how to achieve the initial detection.

<select id="mySelect">
    <option>1</option>
    <option>2</option>
    <option>3</option>
</select>

I would like the solution in JQuery if possible.

Thanks.

Answer 1

$("#mySelect").bind("change", function(event){ ... });

Answer 2

You probably want the .change() handler, like this:

$("#mySelect").change(function() {
  var newVal = $(this).val();
  //do something
});

.val() gets the current value of the dropdown (as a string), just use that to do whatever you want, e.g. alert("The new value is: " + $(this).val());, etc.

Answer 3

$('#mySelect').change(function() {
  alert('Handler for .change() called.');
});

Answer 4

or just use

$("#mySelect").change(function(){
  //do something here
})

Answer 5

jQuery('#mySelect').bind('change',function(e){

        //value of selected item
        var _selectedValues=jQuery(this).val();

        //your codes  here
});

i prefer bind over .change(),. click(), etc: as bind is more generic than others.