Live Content Hilfsfunktionen

Die live_content Komponente zeigt Inhalte an, die über HTMX-Polling automatisch aktualisiert werden. Diese kann verwendet werden, für Dashboards, Statusansichten oder alle Inhalte, die regelmäßig aktualisiert werden müssen.

WCAG AA
HTMX

Funktionen

  • Polling interval: Configurable refresh interval in seconds.

  • Anfänglicher Inhalt: Der Inhalt, welcher vor der ersten Aktualisierung angezeigt wird.

  • HTMX-Integration: Aktualisierungen über asynchrone Anfragen.

HTML

Verwendung

Die Komponente wird über das live_content Tag eingebunden.

{% load insight_tags %} {% live_content config=live_content_config %} <!-- or --> {% live_content tag_id="live-content" url="/api/live-data/" interval=10 %}

Parameter

Laden…

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

Dataclass für die Komponentenkonfiguration.

Name Typ Beschreibung Standardwert Erforderlich
request_url str

URL für Inhaltsaktualisierungen.

 None True
tag_id str

Eindeutige ID für das Targeting mit JavaScript/CSS.

 "" False
interval int

Aktualisierungsintervall in Sekunden.

 10 False
initial_content str

Initialer Inhalt vor dem ersten Update.

 "" False
LiveContentConfig( request_url="/api/stats/", tag_id="live-stats", interval=30, initial_content="Loading...", )

Barrierefreiheit

WCAG AA WCAG AAA
Status
N/A

WCAG AA (Grundlagen)

  • Der Container verfügt über das Attribut aria-live='polite', um Aktualisierungen des Inhalts an Screenreader zu melden.

  • Das Attribut aria-busy wird während des Ladens der Inhalte dynamisch aktualisiert.

  • Der Lade-Spinner hat die Eigenschaft role='status' und die visuelle Anzeige wird mit aria-hidden='true' ausgeblendet.

  • Die Komponente verwendet tabindex='-1', um nach Aktualisierungen einen automatischen Fokus zu ermöglichen.

Verwandte Themen