jQuery : Get and Set Dropdown List Selected Value

jQuery dropdownlist Get/Set Value: Get and set drop-down box selected value. In web pages while form submission many time we commonly use drop-down list, this post explains how to get / fetch dropdown list selected value. In jQuery we get drop-down list selected by using .`val()` method. The .val() method is primarily used to get the values of form elements such as input, select and text area.

Description: Get the current value of the first element in the set of matched elements.

Html:

<select id="myDlist">
        <option value="1">one</option>
        <option value="2">two</option>
        <option value="3">three</option>
        <option value="4">four</option>
</select>

 jQuery: Here using .val() method jQuery select value of selected dropdownlist value.

   // Get the value from a dropdown select
   $('#myDlist option:selected').val();

Another easier way, jQuery get select value

 // Get the value from a dropdown select even easier
 $('#myDlist').val(); 

 View Demo

jQuery Code: Set dropdown list select option by value.

$('#myDlist').val("4");

Above code will set the dropdown list value 4 as selected.

Conclusion: Here using jQuery .val() we able to get dropdownlist selected value. Also using .val() we able to set dropdown list value.