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 - stackoverflow.com/questions/1643227/…

JasCav
– JasCav

2010-08-18 15:00:27 +00:00
Commented Aug 18, 2010 at 15:00 — JasCav
– JasCav, Commented Aug 18, 2010 at 15:00

Sarfraz · Accepted Answer · 2010-08-18 14:59:32Z

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, 2010 at 14:59

Sarfraz

384k81 gold badges561 silver badges613 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Arman Bimatov Over a year ago

I think jQuery can recognize which is selected, even without specifying the selector option:selected. This would work too: $("#availability").val();

KingRider Over a year ago

Can try too $("select[id='availability'] option:selected").val();

Mahdi · Accepted Answer · 2014-01-22 13:55:10Z

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, 2014 at 13:55

answered Jan 22, 2014 at 13:12

Mahdi

9,4479 gold badges58 silver badges75 bronze badges

Comments

JasCav · Accepted Answer · 2010-08-18 14:59:36Z

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, 2010 at 14:59

JasCav

34.7k21 gold badges117 silver badges175 bronze badges

Comments

minura · Accepted Answer · 2017-05-19 10:31:59Z

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, 2017 at 10:31

answered May 19, 2017 at 10:19

minura

511 silver badge2 bronze badges

1 Comment

Anupam Over a year ago

Thanks. Looks like it works for val() but not text()

Nakendra Pun · Accepted Answer · 2015-06-23 13:53:30Z

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, 2015 at 13:53

Nakendra Pun

312 bronze badges

1 Comment

MeanGreen Over a year ago

Welcome to StackOverflow! Could you maybe explain what the code does?

Hiren Gohel · Accepted Answer · 2018-01-23 07:01:33Z

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, 2018 at 7:01

Hiren Gohel

5,0496 gold badges31 silver badges50 bronze badges

answered Jan 23, 2018 at 6:10

Shahbaz Pirzada

1879 bronze badges

Collectives™ on Stack Overflow

Get the selected value in a dropdown using jQuery.

6 Answers 6

2 Comments

Comments

Comments

1 Comment

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

2 Comments

Comments

Comments

1 Comment

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related