Getting the Selected option value in JavaScript
In this post we will give you information about Getting the Selected option value in JavaScript. Hear we will give you detail about Getting the Selected option value in JavaScriptAnd how to use it also give you demo for it if it is necessary.
we are going to learn about how to get a selected option value from the dropdown list using JavaScript.
Consider we have a dropdown list like this.
<select id="places"> <option hidden> Select</option> <option value="india">India</option> <option value="usa">Usa</option> <option value="uk">Uk</option></select>
Now, we need to get the above element’s value when a particular <option> is selected.
Using element.value property
To get the selected option value first, we need to access the <select> element by using its id attribute then it has a value property which is holding the data you are selected.
const places = document.getElementById('places');// on change eventlistener is attachedplaces.addEventListener('change', ()=>{ // getting value console.log(places.value);})
In the above code, we have attached onchange event listener to the select element. so that when a option is selected its value is logged inside the console.
If you want to get the text of a selected option instead of value, you can do it like this.
const places = document.getElementById('places');places.addEventListener('change', ()=>{ // getting text console.log(places.options[places.selectedIndex].text);})
Hope this code and post will helped you for implement Getting the Selected option value in JavaScript. if you need any help or any feedback give it in comment section or you have good idea about this post you can give it comment section. Your comment will help us for help you more and improve us. we will give you this type of more interesting post in featured also so, For more interesting post and code Keep reading our blogs