JavaScript – Get selected value from dropdown list

A JavaScript example to show you how to get the selected value or text from a dropdown list.

A drop box list.


	<select id="country">
		<option value="None">-- Select --</option>
		<option value="ID001">China</option>
		<option value="ID002" selected>United State</option>
		<option value="ID003">Malaysia</option>
	</select>

Get option value :


	var e = document.getElementById("country");
	var result = e.options[e.selectedIndex].value;
	alert(result); //ID002

Get option text :


	var e = document.getElementById("country");
	var result = e.options[e.selectedIndex].text;
	alert(result); //United State

JavaScript Dropdown


<!DOCTYPE html>
<html>
	<head>
		<title>JavaScript - Get selected value from dropdown list</title>
	</head>

	<body>

		<h1>JavaScript - Get selected value from dropdown list</h1>

		<p id="result">United State</p>
		
		<select id="country">
			<option value="None">-- Select --</option>
			<option value="ID001">China</option>
			<option value="ID002" selected>United State</option>
			<option value="ID003">Malaysia</option>
		</select>

		<script>

			function GetSelectedValue(){
				var e = document.getElementById("country");
				var result = e.options[e.selectedIndex].value;
				
				document.getElementById("result").innerHTML = result;
			}

			function GetSelectedText(){
				var e = document.getElementById("country");
				var result = e.options[e.selectedIndex].text;
				
				document.getElementById("result").innerHTML = result;
			}
			
		</script>

		<br/>
		<br/>
		<button type="button" onclick="GetSelectedValue()">Get Selected Value</button>

		<button type="button" onclick="GetSelectedText()">Get Selected Text</button>
	</body>

</html>

Demo

References

About the Author

author image
mkyong
Founder of Mkyong.com, love Java and open source stuff. Follow him on Twitter. If you like my tutorials, consider make a donation to these charities.

Comments

avatar
2 Comment threads
1 Thread replies
0 Followers
 
Most reacted comment
Hottest comment thread
3 Comment authors
AldenyswasimHaseena Recent comment authors
newest oldest most voted
Haseena
Guest
Haseena

Hi, want to get the value from the dropdown without alert and submit.,

wasim
Guest
wasim

Hi What if there are two drop downs with same id ???
How can we access value from both of them ??