In this tutorial, learn how to get a select box option value using jQuery. Find multiple select box option value in jQuery. Multiple select boxes select multiple options by holding the key control and left mouse button.
You have to use the jquery change method to get the select box option value on select input. However, there are two types of the select box. The first is the single option selection select box and the other is the multiple option select box.
You may also like how to show/hide div on dropdown selected using jQuery.
For the single select box, you can select the only single option, and by using the script you can get that selected single option value. But in the multiple option select box, you can select multiple options and get a value of multiple selected options using the script given here.
How to Get Select Box Option Value on Select Using jQuery
Do you want to get the value of the selected option for the single select box? You have to use the “change” function of jQuery, which gives you the value of select input.
<script>
$(document).ready(function(){
$("#Myselect").change(function(){
var myvalue = $(this).val();
alert("You have selected : "+myvalue);
});
});
</script>
<select id="Myselect">
<option value="Red">Red</option>
<option value="Green">Green</option>
<option value="Blue">Blue</option>
<option value="Orange">Orange</option>
<option value="Yellow">Yellow</option>
<option value="Pink">Pink</option>
</select>
<p>Choose your option from the select box given above.</p>