how to get the value of a select option in javascript code example
Example 1: javascript get selected option
var e = document.getElementById("selectElementID");
var value=e.selectElement.options[e.selectedIndex].value;// get selected option value
var text=e.options[e.selectedIndex].text;//get the selected option text
Example 2: javascript to get value of dropdown
var e = document.getElementById("elementId");
var value = e.options[e.selectedIndex].value;
var text = e.options[e.selectedIndex].text;
Example 3: html get selected option javascript
<select id="ddlViewBy">
<option value="1">test1</option>
<option value="2" selected="selected">test2</option>
<option value="3">test3</option>
</select>
<script>
var e = document.getElementById("ddlViewBy");
var strUser = e.value;
var strUser = e.options[e.selectedIndex].text;
</script>
Example 4: javascript get selected option
let selectElement = document.getElementById("selectElement");
let valueSelected = selectElement.options[selectElement.selectedIndex].value; // get selected option value
var text= selectElement.options[selectElement.selectedIndex].text; //get the selected option text
Example 5: use js to get select value
// reference to 'scripts' select list
// used throughout the examples below
var sel = document.getElementById('scripts');
// display value property of select list (from selected option)
console.log( sel.value );
Example 6: js select option value when selected
(function() {
// get references to select list and display text box
var sel = document.getElementById('scripts');
var el = document.getElementById('display');
function getSelectedOption(sel) {
var opt;
for ( var i = 0, len = sel.options.length; i < len; i++ ) {
opt = sel.options[i];
if ( opt.selected === true ) {
break;
}
}
return opt;
}
// assign onclick handlers to the buttons
document.getElementById('showVal').onclick = function () {
el.value = sel.value;
}
document.getElementById('showTxt').onclick = function () {
// access text property of selected option
el.value = sel.options[sel.selectedIndex].text;
}
document.getElementById('doLoop').onclick = function () {
var opt = getSelectedOption(sel);
el.value = opt.value;
}
}());
// immediate function to preserve global namespace