CODEWITHSUNDEEP
javascripthtml
Sunny Gupta
Sunny Gupta

Reputation: 7067

Getting displayed value of select tag

<select id="kamal">
<option value"ACTIVE">a<option>
<option value"DISABLED">b<option>
<option value"DELETED">c<option>
</select>

I want to get the value displayed on the page..not the value shown in the option tag

I am interested in "aktiv" not "ACTIVE"

when i write document.getElementById("kamal").value;then the value that is select comes in the variable. But I want the displayed value.

Please help me how can I take this value.

NOTE: By using all the options given below, it will give me the value of the selected option, I want the label of the selected option. I mean the displayed value on html page.

Upvotes: 3

Views: 12428

Answers (3)

Bogdan Emil Mariesan
Bogdan Emil Mariesan

Reputation: 5647

The solution you are looking for is:

To get the value:

var element = document.getElementById("kamal");
var selectedValue = element.options[element.selectedIndex].value;

To get the text:

var element = document.getElementById("kamal");
var selectedValue = element.options[element.selectedIndex].text;

EDIT:

working example at:

http://jsfiddle.net/n85tW/6/

Upvotes: 8

Sunny Gupta
Sunny Gupta

Reputation: 7067

var element = document.getElementById("kamal"); var selectedValue = element.options[element.selectedIndex].innerHTML;

THis was the solution of my question.

Upvotes: 0

Manse
Manse

Reputation: 38147

Try :

var sel = document.getElementById("kamal")
alert(sel.options[sel.selectedIndex].value);

Working example here

Note: your <option> tags should be closed with </option>

Upvotes: 3

Related Questions