Forum

Posted: **04 May 2015, 10:38**

I have a dropdown select list like this:

<select name="sel1" id="sel1">
  <option value="1">text 1</option>
  <option value="2">txt 2</option>
  <option value="3">text 3</option>
</select>

I can get the value with something like in JS:

Code: Select all

document.getElementById('sel1').addEventListener('change', function(e){
  alert(this.value);
});

But how can I get the actual option text using JavaScript?

Posted: **04 May 2015, 10:40**

Hi,
You can use the selectedIndex property to get the ordered index of the selected option, then, with that index you can get the object with the selected option.
Example:

Code: Select all

Alerts the text of the selected option.
<select name="sites" id="sites">
  <option value="1">MarPlo.net</option>
  <option value="2">CoursesWeb.net</option>
  <option value="3">PHP.net</option>
</select>

<script>
document.getElementById('sites').addEventListener('change', function(e){
  var optxt = e.target.options[e.target.selectedIndex].text;
  alert(optxt);
});
</script>

Demo:

Alerts the text of the selected option.

Forum

JavaScript - Get the text of the Selected Option

JavaScript - Get the text of the Selected Option

JavaScript - Get the text of the Selected Option