Navigieren auf digital.sbb.ch

Beta

Textfield

1. Was macht die Komponente?

  • Dient zur Eingabe von Texten und Zahlen.

2. Wann soll die Komponente eingesetzt werden?

  • Wenn vom Benutzer eine Eingabe benötigt wird.

3. Regeln

  • Ein Eingabefeld hat immer ein Label.
  • Für detaillierte Erklärungen kann neben dem Label ein Fragezeichen im Kreis dargestellt werden. Beim Klick auf dieses Fragezeichen öffnet sich ein Tooltip.
  • Der Eingabetext ist immer einzeilig.
  • Wird der Text während der Eingabe länger als die Breite des Eingabefeldes wird der geschriebene Text nach links verdrängt, damit das aktuell Geschriebene immer gesehen wird.
  • Nach dem Verlassen des Eingabefeldes mit einem langen Text wird dieser am Ende abgeschnitten und mit «...» gekennzeichnet.
  • Ein Eingabefeld kann einen Hinweistext (Placeholder) enthalten, welcher direkt im Eingabefeld angezeigt wird, solange vom Benutzer kein Wert eingetragen wurde.
  • Kann der Benutzer ein Formularfeld nie bearbeiten, so darf kein Eingabefeld verwendet werden (Darstellung als Text).

4. Ausprägungen und Zustände

Das Element hat folgende Zustände:

  • Default
  • Hinted
  • Focused
  • Disabled
  • Error

4.1 Standard

Darstellung der Komponente Textfeld in der Standard Ausprägung

Design Spezifikation

Code Spezifikation

4.2 Passworteingabe

Darstellung der Komponente Textfeld zur Passworteingabe
  • Das Eingabefeld in der Ausprägung «Passwort» stellt keinen Zustand «Hinted» zur Verfügung.

Design Spezifikation