Zur Navigation Zum Inhalt Kontakt Menu Komponente finden Übersicht Lyne Prinzipien Grundlagen Barrierefreiheit Design System Guidelines Deutsch Français Italiano English Unsere Gestaltungsprinzipien Nutzerzentriert Wiedererkennbar Inklusiv Reduziert Ganzheitlich Selbsterklärend Aufgabenorientiert Passend SBB Markenportal Logo Digitale Uhr Nutzungsrechte Basis-Farben Funktionale Farben Off-Brand Farben Icons Fahrplan-Icons Piktogramme Über Barrierefreiheit Über diesen Guide Kontakt Weitere Informationen Product Owner User Research Interaction Design Visual Design Development Content Design Testing Was ist ein Design System?​ Designing Coding FAQ Hilfe Prozess Contribution Kontakt Übersicht Basis Komponenten Übersicht Releases Design Tokens Komponenten Übersicht Basis Informationen Übersicht Basis Komponenten Sinn & Zweck Community Assets Anleitung Power-Apps Digitale Werbebanner SAP App Icons Form-Error Info

Was macht die Komponente?

Sie ist Teil der Form-Field-Komponente.

Wann soll die Komponente eingesetzt werden?

  • Nur innerhalb der Form-Field-Komponente.

Übergeordnete Komponenten

Form-Field
Anatomie
Anatomie der Komponente
Nummer Typ Beschreibung Optional Hinweis
1 Standard-HTML input Nein
1b Standard-HTML input Ja Placeholder
2 Standard-HTML input Nein
3 Komponente sbb-icon Ja Prefix
4 Komponente sbb-icon oder sbb-form-field-clear Ja Suffix
5 Komponente sbb-form-error Nein Datei auswählen
Demo

Beispiele

Error
Error Negative
Error With Custom Icon And Long Message
HTML-Markup kopiert.
Implementation

The sbb-form-error component can be used to provide an error message in inputs components like the
sbb-checkbox-group and
sbb-radio-button-group,
or within the sbb-form-field.

Slots

It is possible to provide the error message via an unnamed slot;
the component displays an icon by default, that can be changed using the icon slot.

<sbb-form-error> This is a required field. </sbb-form-error>

<sbb-form-error>
  <sbb-icon name="pie-small" slot="icon"></sbb-icon>
  This is a required field.
</sbb-form-error>

Properties

Name Attribute Privacy Type Default Description
negative negative public boolean false Negative coloring variant flag.

Slots

Name Description
Use this slot to display the error message.
icon Use this slot to override the default error icon.
Impressum Kontakt Cookie Einstellungen