Get the selected value in a dropdown using jQuery.

Question

My HTML is below. I need to get the selected value (Scheduled) using the <select> tag. How can this be done using jQuery?

<select id="availability" style="display: none;">
  <option value="Available">Available</option>
  <option selected="selected" value="Scheduled">Scheduled</option>
  <option value="Unavailable">Unavailable</option>
</select>

I did a jQuery("#availability") to get the select tag, but I do not know how to get the selected options' value.

Similar question - http://stackoverflow.com/questions/1643227/jquery-get-selected-text-from-dropdownlist — JasCav, Aug 18 '10 at 15:00

score 63 · Accepted Answer · answered Aug 18 '10 at 14:59

63

Try:

jQuery("#availability option:selected").val();

Or to get the text of the option, use text():

jQuery("#availability option:selected").text();

More Info:

answered Aug 18 '10 at 14:59

Sarfraz

377,238
77
533
578

4

I think jQuery can recognize which is selected, even without specifying the selector option:selected. This would work too: $("#availability").val(); – Arman Bimatov May 19 '13 at 21:55
Can try too `$("select[id='availability'] option:selected").val();` – KingRider Oct 08 '15 at 14:00

Mahdi · Answer 2 · 2014-01-22T13:55:10.963

11

The above solutions didn't work for me. Here is what I finally came up with:

$( "#ddl" ).find( "option:selected" ).text();           // Text
$( "#ddl" ).find( "option:selected" ).prop("value");    // Value

edited Jan 22 '14 at 13:55

answered Jan 22 '14 at 13:12

Mahdi

9,247
9
53
74

score 8 · Answer 3 · answered Aug 18 '10 at 14:59

8

$("#availability option:selected").text();

This will give you the text value of your dropdown list. You can also use .val() instead of .text() depending on what you're looking to get. Follow the link to the jQuery documentation and examples.

answered Aug 18 '10 at 14:59

JasCav

34,458
20
113
170

minura · Answer 4 · 2017-05-19T10:31:59.207

5

I have gone through all the answers provided above. This is the easiest way which I used to get the selected value from the drop down list

$('#searchType').val() // for the value

edited May 19 '17 at 10:31

answered May 19 '17 at 10:19

minura

51
1
2

Thanks. Looks like it works for `val()` but not `text()` – Anupam Jun 08 '17 at 10:00

score 3 · Answer 5 · answered Jun 23 '15 at 13:53

3

$('#availability').find('option:selected').val() // For Value 
$('#availability').find('option:selected').text() // For Text
or 
$('#availability option:selected').val() // For Value 
$('#availability option:selected').text() // For Text

answered Jun 23 '15 at 13:53

Nakendra Pun

41
2

Welcome to StackOverflow! Could you maybe explain what the code does? – MeanGreen Jun 23 '15 at 14:18

score 1 · Answer 6 · edited Jan 23 '18 at 07:01

1

Hello guys i am using this technique to get the values from the selected dropdown list and it is working like charm.

var methodvalue = $("#method option:selected").val();

edited Jan 23 '18 at 07:01

Hiren Gohel

4,942
6
29
48

answered Jan 23 '18 at 06:10

Shahbaz Pirzada

157
9

Get the selected value in a dropdown using jQuery.

6 Answers6