How To Add Dropdown List Element in HTML
Similar to radio buttons, a drop down list box also allows you to select a single option from the provided list. Usage depends on the scenario. For example, if the list has few options, use the radio buttons and to display a long list of products you must choose a drop down list box.
In HTML a dropdown list box is defined with the <select> tag in conjunction with two or more <option> elements. The <option> tags inside the <select> element define the available options in the list. An attribute called selected can be added to an option to mark it as the default selected option when the page loads.
Reading the value of a selected item is a two-step process. You first use the selectedIndex property, and then use the value property to find the value of the selected choice. Here's an example:
nIdx = document.contactform.category.selectedIndex;
sCat = document.contactform.category.options[nIdx].value;
This uses the nIdx variable to store the selected index, and then assigns the value of the selected choice to the sCat variable. Things are a bit more complicated with a multiple selection where you need to test each option's selected attribute separately.
Learn the HTML5 language in this tutorial series. These tutorials are designed for new programmers to provide them thorough knowledge of full stack web development.
