Checkbox Eingabe

Die checkbox Komponente stellt eine einzelne Checkbox mit einer Beschriftung bereit. Informationen zu Gruppen verwandter Kontrollkästchen befinden sich unter Checkbox-Gruppe.

WCAG AA

Funktionen

  • Status: Kann über die Konfiguration vorab ausgewählt werden.

  • Benutzerdefinierter Wert: Konfigurierbares Wertattribut für die Formularübermittlung.

  • States: Disabled and required states.

HTML

Verwendung

Die Komponente wird über das checkbox Tag eingebunden.

{% load insight_tags %} {% checkbox tag_id="agb-box" name="accept_agb" value="accept_agb" checked=False disabled=False label="Accept AGBs" %} <!-- or --> {% checkbox config=checkbox_config %}

Parameter

Laden…

config (CheckboxConfig oder als kwargs oder als Kombination aus beidem)

Dataclass für die Komponentenkonfiguration.

Name Typ Beschreibung Standardwert Erforderlich
tag_id str

Optionale, eindeutige Tag-ID für die Identifizierung des Elements im JavaScript.

 None False
name str

Wird für eine <form> benötigt, als Name des Request-Parameters.

 None False
label str

Ein beschreibender Text, welcher über dem Eingabefeld angezeigt wird.

 None False
disabled bool

True, wenn das Feld deaktiviert sein soll.

 False False
disabled_reason str

Erklärung, warum das Eingabefeld deaktiviert ist; wird beim drüberfahren mit der Maus als Tooltip angezeigt. Mit einem leeren String, kann bewusst kein Tooltip angezeigt und die Warnmeldung deaktiviert werden.

 None False
required bool

True, wenn das Feld ausgefüllt werden muss.

 False False
value str

Der Wert der Checkbox (Dabei handelt es sich nicht um den Zustand, siehe dafür 'checked').

 "" False
checked bool

True, wenn die Checkbox ausgewählt sein soll.

 False False
CheckboxConfig( tag_id="accept-terms", name="accept_terms", value="accepted", label="I accept the terms and conditions", )

Barrierefreiheit

WCAG AA WCAG AAA
Status
N/A

WCAG AA (Grundlagen)

  • Das Element <label> umschließt das Element <input> und erzeugt so eine implizite Zuordnung (Label-Wrapping-Muster).

  • Das Checkbox-Element unterstützt den Status „disabled“, der ordnungsgemäß an assistive Technologien übermittelt wird.

  • Required fields add aria-required='true'; help_text and error are rendered as paragraphs linked via aria-describedby, and an error also sets aria-invalid='true' and aria-errormessage; the message itself is plain text, not a live region.

Verwandte Themen