Dropdown Felder

Ein Dropdown Feld oder auch Dropdown Liste ist ein weiterer Weg dem Nutzer eine Möglichkeit zu bieten etwas aus einer Reihe von Auswahlmöglichkeiten auswählen zu lassen. Wann kann man eine Dropdown Liste verwenden? Da der erste Wert einer Dropdown-Liste normalerweise auch der ausgewählte ist, kann eine Dropdown-Liste eine gute Wahl sein wenn man eine oft gewählte Option gerne vorgeben möchte. Eine Dropdown-Liste sollte nur genutzt werden, wenn der Nutzer etwas auswählen muss, da es hier nicht die Option gibt nichts auszuwählen (wie z.B. bei Radio-Buttons).

Dropdown-Listen werden über das <select> Element definiert und die Werte die übermittelt werden (über eMail oder an eine Datenbank) werden durch das value-Attribut definiert.

<form method="post">
	<select name="Icecream Flavours">
		<option value="double chocolate">Double Chocolate</option>
		<option value="vanilla">Vanilla</option>
		<option value="strawberry">Strawberry</option>
		<option value="caramel">Caramel</option>
	</select>
</form>

Wenn man nicht den ersten Wert der Liste als Standardwert angeben möchte, sondern einen anderen Wert aus der Liste, kann man dies mit dem selected-Attribut bewerkstelligen. HTML5 erlaubt einem die verkürzte Version des selected-Attributes zu verwenden, so dass man nicht schreiben muss:

<option value="strawberry" selected="selected">Strawberry</option>

sondern es wie folgt schreiben kann:

<form>
	<select name="Icecream Flavours">
		<option value="double chocolate">Double Chocolate</option>
		<option value="vanilla">Vanilla</option>
		<option value="strawberry" selected>Strawberry</option>
		<option value="caramel">Caramel</option>
	</select>
</form>