Auswahlfelder

(Formulare)

So sieht's im Browser aus:

Das ist der Quelltext dazu:

<select name="feld1" size=4>
  <option> 1. Möglichkeit </option>
  <option> 2. Möglichkeit </option>
  <option> 3. Möglichkeit </option>
  <option> 4. Möglichkeit </option>
</select>

Ein Auswahlfeld wird mit<select name="feld1" size="4"> begonnen und mit </select> beendet. Die Angabe bei size= gibt die Anzahl der gleichzeitig sichtbaren Zeilen an. Dazwischen gibt man mit <option>Text</option> die einzelnen Möglichkeiten an. Für jede Auswahlmöglichkeit muss man so eine Zeile schreiben. Text musst du natürlich durch den Text ersetzen, der im Auswahlfeld erscheinen soll. Die Breite des Auswahlfeldes wird durch die Breite des längsten Texteintrags bestimmt. Das Endtag </option> kann auch weg gelassen werden.

Beim Abschicken wird der Feldname und die markierte Option übermittelt.

Scrollfelder

So sieht's im Browser aus:

Das ist der Quelltext dazu:
<select name="feld2" size=4>
  <option> 1. Möglichkeit </option>
  <option> 2. Möglichkeit </option>
  <option> 3. Möglichkeit </option>
  <option> 4. Möglichkeit </option>
  <option> 5. Möglichkeit </option>
  <option> 6. Möglichkeit </option>
  <option> 7. Möglichkeit </option>
  <option> 8. Möglichkeit </option>
  <option> 9. Möglichkeit </option>
  <option>10. Möglichkeit </option>
</select>

Wenn ein Auswahlfeld mehr Auswahlmöglichkeiten bietet als bei size= angegeben wird, erscheint eine Scrollbar damit auch die zunächst nicht sichtbaren Möglichkeiten ausgewählt werden können.

Dropdownfelder

So sieht's im Browser aus:
Das ist der Quelltext dazu:
<select name="feld3" size=1>
  <option> 1. Möglichkeit </option>
  <option> 2. Möglichkeit </option>
  <option> 3. Möglichkeit </option>
  <option> 4. Möglichkeit </option>
  <option> 5. Möglichkeit </option>
  <option> 6. Möglichkeit </option>
  <option> 7. Möglichkeit </option>
  <option> 8. Möglichkeit </option>
  <option> 9. Möglichkeit </option>
  <option>10. Möglichkeit </option>
</select>

Wenn für ein Auswahlfeld size="1" angegeben wird, erscheint das Auswahlfeld als Dropdownfeld. Wenn es sehr viele Auswahlmöglichkeiten gibt, erscheint im Dropdownfeld auch eine Scrollbar. Ab welcher Grenze nicht mehr alle Optionen angezeigt werden ist vom Browser abhängig und kann meines Wissens nicht durch das Dokument bestimmt werden.

Übertragungswert

So sieht's im Browser aus:
Das ist der Quelltext dazu:<
<select name="feld4" size=1>
  <option value="1"> 1. Möglichkeit </option>
  <option value="2"> 2. Möglichkeit </option>
  <option value="3"> 3. Möglichkeit </option>
  <option value="4"> 4. Möglichkeit </option>
</select>

Wenn für eine Option nicht der Text übermittelt werden soll, der im Auswahlfeld gezeigt wird, kannst du mit value="Text" einen anderen Wert angeben der übertragen werden soll. Wenn im gezeigten Beispiel die 3. Möglichkeit markiert wurde, steht in der Email: feld4=3.

Option vorwählen

So sieht's im Browser aus:
Das ist der Quelltext dazu:
<select name="feld5" size="1">
  <option> 1. Möglichkeit </option>
  <option> 2. Möglichkeit </option>
  <option selected> 3. Möglichkeit </option>
  <option> 4. Möglichkeit </option>
</select>

Wenn eine der Optionen vorgewählt sein soll, kannst du diese Option mit selected bestimmen. Natürlich kann der Benutzer des Formulars die Auswahl ändern.

Mehrfachauswahl

So sieht's im Browser aus:
Das ist der Quelltext dazu:
<select name="feld6" size=10 multiple>
  <option> 1. Möglichkeit </option>
  <option> 2. Möglichkeit </option>
  <option> 3. Möglichkeit </option>
  <option> 4. Möglichkeit </option>
  <option> 5. Möglichkeit </option>
  <option> 6. Möglichkeit </option>
  <option> 7. Möglichkeit </option>
  <option> 8. Möglichkeit </option>
  <option> 9. Möglichkeit </option>
  <option>10. Möglichkeit </option>
</select>

Mit multiple bestimmst du, dass der Benutzer mehrere Optionen auswählen kann. Der Benutzer kann dem Auswahlfeld aber nicht ansehen, dass er mehrere Optionen wählen kann. Weise ihn also darauf hin. Viele Benutzer wissen auch gar nicht, wie das mehrfache Auswählen geht. Erkläre auch das. Falls du auch nicht weißt, wie es geht: Wenn du eine Option anklickst, wird sie farblich hervorgehoben. Sie ist dann ausgewählt. Wenn du eine andere Option anklickst, wird die alte Auswahl abgewählt und statt dessen die neue Option ausgewählt. Wenn du beim Auswählen der neuen Option aber die Strg-Taste drückst, und dann die neue Option anklickst, bleibt die alte Auswahl bestehen, und die neue wird zusätzlich ausgewählt. Wenn du statt der Strg-Taste die Shift-Taste (Umschalttaste) drückst, wird zusätzlich zur alten Auswahl, die neu gewählte Option und alle dazwischen liegenden ausgewählt. Wenn du mit gedrückter Strg-Taste eine bereits ausgewählte Option anklickst, wird diese Option wieder abgewählt. Tipp: Diese umständliche Erklärung ist ein Grund, diese Funktion nicht zu benutzen. Normalerweise kann man auch Checkboxen verwenden. Was das ist und wie man sie macht wird noch erklärt.

Im nächsten Kapitel geht's um Radiobuttons (hat nix mit Musik zu tun).


Um einen Link zu setzen, der direkt auf diese Seite führt, verwende folgende Url: