HTML - Elemente - Formulare - Auswahloptionen
1. Radio-Buttons
Radio-Buttons sind Formularelemente, die so aussehen: . Wenn man auf sie drückt, so werden sie "markiert", also aktiviert. Dabei gibt es wie gehabt, je nach DTD zwei Schreibweisen (diesmal setze ich keinen Link, das müsstet ihr mittlerweile selber wissen).
<!-- HTML 4 -->
<input type="radio" name="bla">
<!--XHTML 1 -->
<input type="radio" name="bla" />
radio
-Elemente haben bei gleichem name
-Attribut die Eigenschaft, dass man nur eines
auswählen kann! Klickt mal in folgendem Beispiel auf die runden Felder, um zu sehen, was passiert.
Beispiel
Möglichkeit A Möglichkeit B Möglichkeit C
<input type="radio" name="bla" value="1" />
<input type="radio" name="bla" value="2" />
<input type="radio" name="bla" value="3" />
name
, value
Sollen mehrere dieser radio
-Typen zu einer organisatorischen Einheit zusammengefasst werden so müssen sie denselben
Wert beim name
-Attribut haben, ansonsten kann man sie beliebig markieren. Die Unterscheidung erfolgt
dann über die verschiedenen Werte des value
-Attributs.
checked
Mit diesem Attribut kann man einen Radio-Button vorab markieren. Allerdings pro Gruppe nur einmal! Also bei allen mit demselben Namen.
<!-- HTML 4 -->
<input type="radio" name="bla" value="1" checked>
<!-- XHTML 1 -->
<input type="radio" name="bla" value="1" checked="checked" />
2. Check-Boxen
... bieten die Möglichkeit eine oder mehrere Optionen zu aktivieren. Eine klassische Anwendung für eine Checkbox ist zum Beispiel, den AGBs zuzustimmen. Eine weitere Möglichkeit ist zum Beispiel, zu einer Frage mehrere Antworten geben zu können:
Welche sexuellen Neigungen hast du?
Homosexuell
Heterosexuell
Linkshänder
Rechtshänder
<input type="checkbox" name="neigung_1" value="homosexuell" />
<input type="checkbox" name="neigung_2" value="hetero" />
<input type="checkbox" name="neigung_3" value="links" />
<input type="checkbox" name="neigung_4" value="rechts" />
Wichtig!
Damit alle markierten Felder übertragen werden, müssen die einzelnen Checkboxen unterschiedliche Namen haben. Allerdings gibt es da eine wunderbare Alternative für PHP, indem man den Feldnamen mit einem leeren Index anlegt. Da braucht man nur einen Namen zu wählen. Der steht dann dem zu verarbeiteten Script als Array zur Verfügung. Und das geht so:
<input type="checkbox" name="neigung[]" value="homosexuell" />
<input type="checkbox" name="neigung[]" value="hetero" />
<input type="checkbox" name="neigung[]" value="links" />
<input type="checkbox" name="neigung[]" value="rechts" />
name
, value
Ist genau dasselbe wie bei den Radio-Buttons.
checked
Funktioniert auch so wie oben schon beschrieben. Allerdings gibt es bei den Checkboxen einen Unterschied. Es dürfen hier im Gegensatz zu den Radio-Buttons mehrere Felder vorbelegt werden.
<input type="checkbox" name="bla[]" value="1" checked="checked" />
<input type="checkbox" name="bla[]" value="2" checked="checked" />
3. Attribut disabled
Dieses Attribut kann bei beiden Auswahltypen gesetzt werden, dann hat man wie bei den Textfeldern keinerlei Zugriff mehr auf diese Elemente. Ist in meinen Augen eigentlich nur sinnvoll bei gesetzten Werten, über die man informieren will, man aber eine Änderung verhindern möchte.
<input type="radio" name="bla" value="1" disabled="disabled" />
<input type="checkbox" name="blubb" value="1" disabled="disabled" />
Beispiel
Du darfst Mails verschicken Du bist Rechtshänder
zurück zum vorherigen Abschnitt weiter zum nächsten Abschnitt