Get selected value of a dropdown's item using jQuery
How can I get the selected value of a dropdown box using jQuery?
I tried using
var value = $('#dropDownId').val();
and
var value = $('select#dropDownId option:selected').val();
but both return an empty string.
For single select dom elements, to get the currently selected value:
$('#dropDownId').val();
To get the currently selected text:
$('#dropDownId :selected').text();
var value = $('#dropDownId:selected').text()
Should work fine, see this example:
$(document).ready(function(){
$('#button1').click(function(){
alert($('#combo :selected').text());
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="combo">
<option value="1">Test 1</option>
<option value="2">Test 2</option>
</select>
<input id="button1" type="button" value="Click!" />
Try this jQuery,
$("#ddlid option:selected").text();
or this javascript,
var selID=document.getElementById("ddlid");
var text=selID.options[selID.selectedIndex].text;
If you need to access the value and not the text then try using val()
method instead of text()
.
Check out the below fiddle links.
Demo1 | Demo2
try this
$("#yourDropdown option:selected").text();