How to Get the Selected Value and Text from a Dropdown List in JavaScript?

Getting Selected Value from a Dropdown List in JavaScript

Accessing the selected value from a dropdown or select box using JavaScript is a common task in web development. The selected value provides key information for processing forms and interacting with the user.

To retrieve the selected value, we can utilize the value property of the element. This property represents the option that is currently selected by the user.

Let's demonstrate this with an example:

<form>
  <select>

var e = document.getElementById("ddlViewBy");
var value = e.value;

In this example, the variable e references the

element, and e.value retrieves the selected value, which in this case is "2".

Additionally, you can also obtain the text associated with the selected option using:

var text = e.options[e.selectedIndex].text;

This code assigns the text content of the selected option to the text variable.

Interactive Example:

[Example](interactive-example-code)

This example allows you to select an option from the dropdown and logs both the selected value and text to the console for your reference.

The above is the detailed content of How to Get the Selected Value and Text from a Dropdown List in JavaScript?. For more information, please follow other related articles on the PHP Chinese website!