Nächste Überarbeitung | Vorhergehende Überarbeitung |
modul:m293:learningunits:lu07:checkbox [2024/03/28 14:07] – created - external edit 127.0.0.1 | modul:m293:learningunits:lu07:checkbox [2024/05/27 07:21] (aktuell) – [Checkbox] msuter |
---|
<code html4strict> | <code html4strict> |
<form> | <form> |
<input type='radio' id='mc' name='Zahlmethode' value='Mastercard'> | <input type="radio" id="mc" name="Zahlmethode" value="Mastercard"> |
<label for='mc'> Mastercard</label> | <label for="mc"> Mastercard</label> |
<input type='radio' id='vi' name='Zahlmethode' value='Visa'> | <input type="radio" id="vi" name="Zahlmethode" value="Visa"> |
<label for='vi'> Visa</label> | <label for="vi"> Visa</label> |
<input type='radio' id='ae' name='Zahlmethode' value='AmericanExpress'> | <input type="radio" id="ae" name="Zahlmethode" value="AmericanExpress"> |
<label for='ae'> American Express</label> | <label for="ae"> American Express</label> |
</form> | </form> |
</code> | </code> |
* ''value'': Dieses Attribut bestimmt einen internen Bezeichnerwert für jede Checkbox (value = Wert). Wenn der Benutzer das Formular abschickt, wird der Bezeichnerwert der markierten Checkbox(en) übertragen. | * ''value'': Dieses Attribut bestimmt einen internen Bezeichnerwert für jede Checkbox (value = Wert). Wenn der Benutzer das Formular abschickt, wird der Bezeichnerwert der markierten Checkbox(en) übertragen. |
* ''id'': Eindeutige ''id'' um mit einem ''label'' Element zu verknüpfen | * ''id'': Eindeutige ''id'' um mit einem ''label'' Element zu verknüpfen |
* ''checked'': Ein Boolean-Attribut. Wenn Sie eine oder mehrere Auswahlmöglichkeiten vorab markieren möchten, fügen Sie dem entsprechenden ''<input>''-Tag das Attribut checked hinzu. Beispiel: ''<input type='checkbox' name='Kenntnisse_in' value='HTML' checked>''. | * ''checked'': Ein Boolean-Attribut. Wenn Sie eine oder mehrere Auswahlmöglichkeiten vorab markieren möchten, fügen Sie dem entsprechenden ''<input>''-Tag das Attribut checked hinzu. Beispiel: ''<input type="checkbox" name="Kenntnisse_in" value="HTML" checked>''. |
| |
Die Werte der ausgewählten Checkboxen werden beim Absenden des Formulars übertragen. Es ist auch möglich, Gruppen von Checkboxen mit demselben Namen (''name'') zu erstellen. Technisch gesehen ist dies nur für die Übertragung wichtig, da Checkboxen in einer Gruppe unabhängig voneinander ausgewählt werden können. | Die Werte der ausgewählten Checkboxen werden beim Absenden des Formulars übertragen. Es ist auch möglich, Gruppen von Checkboxen mit demselben Namen (''name'') zu erstellen. Technisch gesehen ist dies nur für die Übertragung wichtig, da Checkboxen in einer Gruppe unabhängig voneinander ausgewählt werden können. |
<code html4strict> | <code html4strict> |
<form> | <form> |
<input type='checkbox' name='zutat[]' value='kaese' id='check1' checked> | <input type="checkbox" name="zutat[]" value="kaese" id="check1" checked> |
<label for='check1'>Käse</label> | <label for="check1">Käse</label> |
<input type='checkbox' name='zutat[]' value='schinken' id='check2'> | <input type="checkbox" name="zutat[]" value="schinken" id="check2"> |
<label for='check2'>Schinken</label> | <label for="check2">Schinken</label> |
<input type='checkbox' name='zutat[]' value='salami' id='check3'> | <input type="checkbox" name="zutat[]" value="salami" id="check3"> |
<label for='check3'>Salami</label> | <label for="check3">Salami</label> |
<input type='checkbox' name='zutat[]' value='oliven' id='check4'> | <input type="checkbox" name="zutat[]" value="oliven" id="check4"> |
<label for='check4'>Oliven</label> | <label for="check4">Oliven</label> |
<input type='checkbox' name='zutat[]' value='paprika' id='check5'> | <input type="checkbox" name="zutat[]" value="paprika" id="check5"> |
<label for='check5'>Paprika</label> | <label for="check5">Paprika</label> |
<input type='checkbox' name='zutat[]' value='pilze' id='check6' > | <input type="checkbox" name="zutat[]" value="pilze" id="check6" > |
<label for='check6'>Pilze</label> | <label for="check6">Pilze</label> |
</form> | </form> |
</code> | </code> |
| |
Jede ''<input type='checkbox'>'' benötigt ein zugehöriges ''<label>'', das die Beschriftung für die entsprechende Option darstellt. Das ''<label>'' kann vor oder hinter dem Ankreuzfeld positioniert werden und das ''for''-Attribut des ''<label>''-Elements verweist auf die ''id'' der entsprechenden Checkbox. | Jede ''<input type="checkbox">'' benötigt ein zugehöriges ''<label>'', das die Beschriftung für die entsprechende Option darstellt. Das ''<label>'' kann vor oder hinter dem Ankreuzfeld positioniert werden und das ''for''-Attribut des ''<label>''-Elements verweist auf die ''id'' der entsprechenden Checkbox. |
| |
<WRAP center round important 60%> | <WRAP center round important 60%> |
Alle Checkboxen-mit demselben Namen gehören zu einer Gruppe. Damit ''php'' auf dem Server diese Werte auch als Array interpretieren kann muss das 'name'' Attribut mit eckigen Klammern abgeschlossen werden ''[]'' | Alle Checkboxen-mit demselben Namen gehören zu einer Gruppe. Damit ''php'' auf dem Server diese Werte auch als Array interpretieren kann muss das ''name'' Attribut mit eckigen Klammern abgeschlossen werden ''[]'' |
</WRAP> | </WRAP> |
| |