Auswahlliste (Select-Box)
Eine Auswahlliste (Select-Box) bietet dem Anwender feste Einträge an, aus denen er einen oder mehrere Einträge wählen kann. Das klassische Beispiel ist die Auswahl eines Landes über eine Select-Box.
Auswahllisten beginnen mit dem Tag <select> und enden mit dem Tag </select>. Das End-Tag ist nötig und darf nicht weggelassen werden. <select ...></select>
Attribut: name=“”
Jede Auswahlliste muss einen Namen erhalten, und zwar mit dem Attribut name.
Bei der Wahl des Namens gilt folgendes: Der vergebene Name wird bei Verarbeitungs-Scripten benötigt, um auf die Daten der Auswahlliste zugreifen zu können. Der Name sollte nicht zu lang sein und darf keine Leerzeichen, Sonderzeichen oder Umlaute enthalten. Das erste Zeichen muss ein Buchstabe sein, danach sind auch Ziffern erlaubt.
Benutzen Sie als Sonderzeichen im Namen höchstens den Unterstrich _.
<select name="Zahlungsart"></select>
Attribut: size=“” (optional)
Mit dem Attribut size wird die Anzeigegröße der Liste bestimmt, also wie viele Einträge angezeigt werden sollen. Wenn die Liste mehr Einträge enthält als angezeigt werden, kann der Anwender in der Liste scrollen. Bei size="1" wird eine so genannte “Dropdown-Liste” angezeigt.
<select name="Zahlungsart" size="1"></select>
Einträge definieren mit <option>
Mit <option>...</option> zwischen dem einleitenden <select>-Tag und dem Abschluss-Tag </select> wird der Auswahlliste ein Eintrag hinzugefügt. Hinter <option> steht der Text des Listeneintrags. Den Wert des Eintrages, der beim Absenden verschickt wird, wird als value im <option> angegeben (siehe Beispiel weiter unten). Die Anzahl der Listeneinträge ist optional.
Auswahlliste mit Mehrfachauswahl
Wird nichts anderes angegeben, kann der Anwender aus einer Auswahlliste genau einen Eintrag auswählen. Um eine Mehrfachauswah zu ermöglichten wird das Attribut multiple verwendet.
<select multiple="multiple"></select>
Beispiel
Bitte wählen Sie Ihren Pizzabelag:<br />
<select name="Belag" size="4" multiple="multiple">
<option value="Salami">Salami</option>
<option value="Schinken">Schinken</option>
<option value="Tomaten">Tomaten</option>
<option value="Oliven">Oliven</option>
</select>So sieht’s aus:
Bitte wählen Sie Ihren Pizzabelag:
Für Mehrfachauswahl Strg-Taste (Mac: cmd-Taste) gedrückt halten.
Einträge vorselektieren
Wird nichts anderes angegeben, ist zunächst kein Eintrag einer Auswahlliste vorselektiert. Sie können einen Eintrag vorselektieren. In Verbindung mit Mehrfachauswahl können Sie auch mehrere Einträge vorselektieren. Vorselektierte Einträge haben einen sichtbaren Markierungsbalken.
<option value="Bankeinzug" selected="selected">Bankeinzug</option>
Beispiel
Bitte wählen Sie die gewünschte Zahlungsart: <select name="Zahlungsart">
<option value="Kreditkarte">Kreditkarte</option>
<option value="Bankeinzug" selected="selected">Bankeinzug</option>
<option value="Vorkasse">Vorkasse</option>
</select>So sieht’s aus:
Bitte wählen Sie die gewünschte Zahlungsart:
Tipp: Verwenden Sie den WebMart Formular Generator um einfach und schnell individuelle Formulare zu erstellen.