One of the most common problems I often find in many programming forums is getting the value of a selected option in a drop down. Well, in JQUERY you can select it easily with just a couple of lines. Getting the selected value's in a drop down is important mostly used in forms in getting the users selection. In this tutorial you can see how it is easily done.
From the code above, we are just getting the value of the HTML element with the "ID" #selection.
<select id="dropdown"> <option value="1">John</option> <option value="2">Drake</option> <option value="3">Simon</option> <option value="4">Bob</option> </select>
If ever you want to get the value of what is being selected on the drop down. All you have to do use the "option:selected".
By using the .text() method, you are actually getting the names of the selected item in the drop down. If you select the first option, then you will be return with the text "John". However, if you want to get the value all you have to do is change the .text() method into a .val() method.
In that case, if you select "Drake" from the dropdown list, you are returned with the value "2".
var dropdownValue = $("#dropdown option:selected").val();
The variable dropdownValue will store what is being selected on the dropdown.
For more information you can check out Dr. Richard's tutorial.