There are a variety of ways to use JavaScript to obtain the value of the selected option in a select list or a reference to the selected option:. We will discuss all of these here, starting with the value property.

The following form is used to demonstrate:. Scrolling Divs JavaScript JavaScript Tooltips Continuous Scroller Rotating Banner JavaScript Random Image PHP PHP Form Generator PHP Table Class PHP Order Forms.

Make a selection from the list and click the buttons to see the result. The markup and JavaScript for the example are displayed below. The value property of a select box comes from the value attribute of the selected option or the first selected option in a select-multiple type select box.

javascript - set option "selected" attribute from dynamic created option - Stack Overflow

So the value of the selected option can be obtained in JavaScript as follows:. If option elements do not contain a value attribute, generally the text content of the option element will be the value property.

However, Internet Explorer prior to version 9 will not provide the value in this case. If your option elements do not include value attributes and you wish to support older browsers, for best results use the selectedIndex and text properties. The selectedIndex property provides the index number of the selected option in a select list.

The options property of the select list is a node list of all the option elements contained within it.

The selectedIndex property of the select list specifies the location of the selected option in the node list. The text property of an option is the content of the option element. You can use a for loop to iterate through the options of a select list to determine which is selected.

javascript - Get selected value/text from Select on change - Stack Overflow

A function can be defined to return a reference to the selected option or its value. The following returns a reference to the selected option:.

HTML DOM Option value Property

This function returns a single selected option, which is suitable for a select-one type select list. A similar function suited for select-multiple type select lists can return multiple selected options. Dynamic Web Coding Tutorials JavaScript PHP Site Map.

Get Value or Selected Option in Select Box There are a variety of ways to use JavaScript to obtain the value of the selected option in a select list or a reference to the selected option: Use the value property of the select list. Use the selectedIndex property.

Loop through the options and determine which one is selected and return either its value or a reference.

The following form is used to demonstrate: Get Value or Text of Selected Option Scrolling Divs JavaScript JavaScript Tooltips Continuous Scroller Rotating Banner JavaScript Random Image PHP PHP Form Generator PHP Table Class PHP Order Forms Make a selection from the list and click the buttons to see the result.

The value Property The value property of a select box comes from the value attribute of the selected option or the first selected option in a select-multiple type select box. So the value of the selected option can be obtained in JavaScript as follows: Find out more about a select list's selectedIndex property as compared to the selected property of an option object. More JavaScript and Forms Forms Tutorial Overview Obtaining References Forms and Event Handling JavaScript and Radio Buttons JavaScript and Checkboxes.

Like dyn-web site speed? Hosted by Digital Ocean!