19. Checkboxen in Formularen

Wir bleiben bei unserem Formular und ergänzen dieses um zwei Checkboxen, die der Benutzer auswählen kann (s. untere Abbildung).

Abbildung 19.1: Checkboxen

Aufgabe

Fügen Sie zwei neue input-Tags plus label-Tags hinzu. Der Typ für das input-Tag lautet checkbox.

Vergeben Sie das Attribut name mit einer Bezeichnung.

Fügen Sie ebenfalls die Attribute for und id ein.

Zunächst wollen wir nur mit Hilfe der Funktion var_dump die Formulardaten analysieren. Eine Ausgabe ist noch nicht vorgesehen.

Zum Design

Für die Checkboxen müssen wir in CSS Änderungen vornehmen. Die Checkbox und die dazugehörige Bezeichnung (label) sollten nicht untereinander liegen, sondern nebeneinander.

Fügen Sie folgenden Code in die CSS-Datei ein:

Abbildung 19.2: CSS-Code für die Checkboxen

Bei dem Ausdruck .label_checkbox handelt es sich um eine class, die für das label-Tag bestimmt ist. Fügen Sie also noch die class "label_checkbox" in beide label-Tags ein:

Abbildung 19.3: Neue Klasse für die Label-Tags

Testen Sie nun das Formular mit den neuen Checkboxen.

Was zeigt Ihnen die Funktion var_dump an?