Get Selected Index And Option Text With JavaScript

The below example shows how to get the value, selected index, selected text of a drop down with JavaScript.

The HTML select is below

Select a value
First Option
Second Option
Third Option
Fourth Option

Now the JavaScript to get the values. Within the firejs function (that is fired with onchange event) the following can be used. In the example we will select ‘Third Option’.

obj = document.getElementById(‘jstestid’) assigns the select element obj to variable obj

obj.value value of the selected option = ‘three’

obj.selectedIndex value of the selected index = ‘3’

obj.options[obj.selectedIndex].text text of the selected option = ‘Third Option’

obj.options[obj.selectedIndex].value value of the selected option = ‘3’

obj.options[obj.selectedIndex].text = ‘New Third Option’ changes the text of the selected option i.e. ‘Third Option’ to ‘New Third Option’

obj.options[obj.selectedIndex].text now the text of the selected option after being changed = ‘New Third Option’