jQuery get the selected dropdown value on change

Question

I\'m trying to get the value of a dropdown on change (and then change the values in a second dropdown).

EDIT: Thanks for all the replies, i\'ve upda

Answer 1

You must obtain the value using a method, not a property. Use this:

alert($(this).val())

Answer 2

You can also obtain custom attributes from the dropdown as below;

     $('.someclass').change (function () { 
              var val = this.value;
              alert(val);                                       //selected value

               var element = $(this).find('option:selected');  // assign selected element
               var myTag = element.attr("aTag");              // get attribute by name
               alert(myTag);
    });


<option name='somename' id='someid' aTag='123' value='XYZ'>XYZ</option>

Answer 3

Check jQuery and Javascript methods here to get Single/ Multiple selected values in the Drop Down

Demo Link

jQuery Method: Method to get Selected Value from a select box:

HTML

<select id="singleSelectValueDDjQuery" class="form-control">
    <option value="0">Select Value 0</option>
    <option value="8">Option value 8</option>
    <option value="5">Option value 5</option>
    <option value="4">Option value 4</option>
</select>

<input type="text" id="textFieldValueJQ" class="form-control"
    placeholder="get value on option select">

jQuery

$("#singleSelectValueDDjQuery").on("change",function(){
    //Getting Value
    var selValue = $("#singleSelectValueDDjQuery").val();
    //Setting Value
    $("#textFieldValueJQ").val(selValue);
});

Method to get Selected Value Option Text from a select box:

HTML

Select Value 0 Option value 8 Option value 5 Option value 4

<input type="text" id="textFieldTextJQ" class="form-control"
                placeholder="get value on option select">

jQuery

$("#singleSelectTextDDjQuery").on("change",function(){
    //Getting Value
    var selValue = $("#singleSelectTextDDjQuery :selected").text();
    //Setting Value
    $("#textFieldTextJQ").val(selValue);
});

Answer 4

val is a method, not a property.

use it like val()

If you are using it many places, i would assign it to a local variable and use it thereafter.

Also you can use the $.now() function to get the unique time stamp. It is equal to DategetTime();

$('.dropone').change(function() {    
    var item=$(this);
    alert(item.val())
    $(".droptwo").empty();
    $(".droptwo").load("ajaxdropdown.aspx?drpType=room
                        &roomid=" +item.attr("value") + "&ts=" + $.now());
});

Answer 5

Add round brackets to your val: alert($(this).val())

Answer 6

$('.dropone').change(function() {
  var val = $(this).val(); 

  // OR

  var val = this.value;
})