öffentlich
Redaktion Druckversion

HTML lernen (3): Formulare einbinden

4.666665
(3)
Beitrag bewerten
Kommentar schreiben
Stand: 1. September 2007

Auswahllisten (Drop-Down-Box)

Allgemeines

Abfragen nach dem Multiple-Choice-Verfahren lassen sich mit Check- und Radiobuttons in Formularen umsetzen. Für lange Auswahllisten sind diese Buttons allerdings eher ungeeignet, da ein Formular mit zu vielen Check- oder Radiobuttons am Bildschirm sehr unübersichtlich ausssieht. Um möglichst platzsparend und übersichtlich Listen in einem Formular einzusetzen, bedient man sich sogenannter Auswahllisten (Drop-Down-Box).

In der Liste stehen dem Benutzer feste Einträge zum Auswählen zur Verfügung. Durch bestimmte Einstellungen der Attribute läßt sich einstellen, ob eine Mehrfachauswahl zugelassen wird, und ob die Auswahlliste als Drop-Down-Box oder Listenfeld mit Scrollbalken erscheinen soll.

Darstellung einer Auswahlliste

Auswahlliste

<form method="POST">
<b>Wählen Sie Ihr Reiseziel:</b>
<select name="reise" size="1">
<option>Thailand</option>
<option>USA</option>
<option>Mecklenburg-Vorpommern</option>
</select>
</form>

Gültige Attribute

Gültige Attribute für das <select> -Tag

Folgende Attribute stehen zur Verfügung:

  • name="reise"
    Dem Textfeld wird ein Variablenname zugewiesen. Diese Angabe ist erforderlich, da nur Elemente mit Bezeichnung an den Server geschickt werden können. Es sind nur Buchstaben und Zahlen erlaubt, Leerzeichen und Sonderzeichen dürfen nicht verwendet werden.

  • size="3"
    Mit dem Attribut size legen Sie fest, wieviele Einträge gleichzeitig zu sehen sein sollen. Standardmäßig ist der Wert auf 1 eingestellt. Möchten Sie eine Auswahllise darstellen, in der mehrere Einträge gleichzeitig zu sehen sein sollen, müssen Sie für size den gewünschten Wert einstellen.
    (Beispiel: Sollen drei Einträge gleichzeitig zu sehen sein, müssen Sie den Wert für size auf 3 einstellen.)

  • multiple
    Wird dieses Attribut eingesetzt, ist eine Mehrfachauswahl zugelassen. Mit Hilfe der STRG-Taste können dann mehrere Einträge aus der Liste gewählt werden.

Gültige Attribute für das <option> -Tag

Folgende Attribute stehen zur Verfügung:

  • value="usa"
    Ein mit value festgelegter Wert wird bei der Auswahl des Eintrags an den Server übertragen. Ist das Attribut value nicht gesetzt, wird bei Auswahl des Eintrags der Text zwischen den <option>.....</option>-Tags an den Server übertragen.

  • selected
    Normalerweise ist kein Eintrag in einer Auswahlliste selektiert. Sollte es dennoch notwendig sein, einen Eintrag der Liste zu kennzeichnen, läßt sich das mit dem Attribut selected erreichen.

Beispiele

HTML Code für Auswahllisten

<form method="POST">

<b>Wählen Sie Ihr Traumauto:</b>
<select name="auto" size="1">
<option>Mercedes A-Klasse</option>
<option>Ente</option>
<option>Fiat 500</option>
<option>Trabbi</option>
<option>VW-Käfer</option>
</select>

<b>Jetzt mal im Ernst:</b>
<select name="traumauto" multiple size="4">
<option>Jaguar</option>
<option>Porsche</option>
<option>Chrysler</option>
<option>Oldtimer</option>
</select>

</form>

Mitglied werden, Vorteile nutzen!

  • Sie können alles lesen und herunterladen: Beiträge, PDF-Dateien und Zusatzdateien (Checklisten, Vorlagen, Musterbriefe, Excel-Rechner u.v.a.m.)
  • Unsere Autoren beantworten Ihre Fragen

Downloads zu diesem Beitrag

Über die Autorin:

bild117238

Kerstin Dankwerth arbeitet seit 1996 als Grafikerin und Web-Entwicklerin im Netz. Zu ihren Stammkunden gehören u.a. akademie.de, 104I9 OldieStar Radio, FDP Berlin,

Newsletter abonnieren