Formularelemente

Die Bausteine eines Formulars

Die Formularelemente stellen die Kommunikationsschnittstelle zwischen Formularnutzer*in und Formularempfänger*in dar. Sie dienen also dazu die gewünschten Informationen abzufragen und zu übermitteln.

Verfügbare Typen von Formularelementen

Bei Auswahl von „Formular“ im Elementebaum des Formulareditors, erscheinen an dessen oberen Rand folgende auswählbare Formularelemente:

  • Eingabefeld
  • Textarea
  • Einfachauswahl
  • Auswahlliste
  • Mehrfachauswahl
  • Datei
  • Verstecktes Feld
  • Paragraph
  • Seitenumbruch
  • Zusammenfassung
  • Berechneter Wert
  • Bedingung
  • Layout
Formularelemente auch über Kontextmenü erreichbar

Bei jedem einzelnen Formularelement können bzw. müssen Sie einige Eigenschaften festlegen. Manche dieser Eigenschaften gleichen sich in mehreren Formularelementen.

Im Folgenden finden Sie Erläuterungen zu wiederkehrenden Eigenschaftenfeldern.

Eigenschaften eines Formularelementes

Name
Geben Sie hier den technischen Namen des Formularelementes an. Jeder Name darf nur einmal pro Formular vergeben werden und darf keine Sonderzeichen (auch Leerzeichen) enthalten.

Beschriftung
Die Beschriftung, die für die/den Nutzerin/Nutzer angezeigt wird. Sie wird auch z. B. in der Zusammenfassung angezeigt.

Hinweis
Hinweistext mit kleiner Schriftgröße unter dem Formularfeld. Beispielsweise ein Hinweistext, wie das Formularfeld auszufüllen ist.
Um den Hinweistext zu formatieren, können Sie die sogenannte Markdown-Syntax verwenden. Wie Sie diese verwenden können, finden Sie in dem Artikel Formatierung von Texten in Webforms. Sie können den Hinweistext fett oder kursiv gestalten, Überschriften einbauen oder Links einfügen.

Vorbelegung
Der Text, der standardmäßig in das Feld eingetragen sein soll. Dieser wird auch als Wert verwendet, d. h. wenn die/der Nutzer*in das Feld nicht ausfüllt, wird dieser Wert beim Versenden des Formulars mit übertragen. Sie können an dieser Stelle auch Variablen verwenden, die z. B. das Datum automatisch an diese Stelle setzen. Weitere Informationen dazu finden Sie im Artikel Berechneter Wert, Bedingungen und Variablen .

Platzhalter
Blasser Text, der vor Eingabe des Nutzers im Eingabefeld steht, wird nicht als Wert verwendet. Sie können den Platzhalter als Ausfüllhilfe verwenden.

Maximale Länge
Begrenzt die Länge des möglichen Textes im Eingabefeld.

Anzeigevariante
Hier haben Sie wie bei einigen Elementen die Möglichkeit, die Darstellung zu beeinflussen, z. B. die Anzeigebreite. Weitere Erklärungen zu den Varianten finden Sie bei dem jeweiligen Formularelement.

Vorschläge
Diese Auswahlliste ist derzeit leer.

Pflichtfeld
Setzt man hier den Haken, muss das Feld ausgefüllt werden. Geschieht dies nicht, erhält man beim Absendeversuch eine Fehlermeldung.

Schreibgeschützt
Durch Aktivierung dieser Checkbox legen Sie fest, dass der/die Nutzer*in den Text im Feld nicht verändern kann. Diese Option ist nur sinnvoll, wenn Sie das Feld gleichzeitig vorbelegt haben.

Die einzelnen Formularelemente

Im Folgenden finden Sie Erläuterungen zu den einzelnen Elementen, welche Sie in einem Webforms Formular nutzen können.

Ein Eingabefeld ist ein einzeiliges Texteingabefeld, in das der/die Nutzer*in eine Eingabe (Text) hineinschreiben kann.

Zu oben genannten Eigenschaften, haben Sie noch folgende Einstellungsmöglichkeiten:

Beispiele für Anzeigevarianten „Datum“ und „schmal“

Anzeigevariante
Hier können Sie durch die verschiedenen Varianten bestimmen, um welche Art von Eingabe es sich handeln soll z. B. E-Mail, Telefonnummer oder Datum, oder in welchem Format das Eingabefeld angezeigt werden soll (z. B. schmal).
Mit diesen Varianten wird der Typ des Eingabefelds so gesetzt, dass z. B. auf Mobilgeräten die passende Tastatur angezeigt wird, oder der Browser spezielle Eingabefunktionalitäten bereitstellt.

Verwenden Sie als Anzeigevariante „Datum“, dann nehmen Sie bitte nicht gleichzeitig eine Validierung mit „Datum“ vor, da es sonst zu Fehlern kommt.

Validierung
Bei dieser Auswahl legen Sie fest, in welchem Format ein Feld ausgefüllt werden soll, bzw. ob es eine Grenze für Datumswerte und Zahlen geben soll. Ausgewählt werden können:

  • Email
  • Datum
  • Zahl
  • Regulärer Ausdruck
  • Postleitzahl
  • Telefonnummer
  • Anzahl der Zeichen
  • BIC
  • IBAN
  • Gleicher Wert

Anschließend können Sie eine alternative Fehlermeldung angeben, die anstelle der Standardfehlermeldung ausgegeben wird, falls die Eingabe nicht im richtigen Format angegeben wurde.
Weitere Informationen zu den einzelnen Validatoren

Vorbelegung mittels IDM-Daten

Durch das Identity Management ist es möglich, die Eingabefelder, in die die TU-ID, der Vor- und Nachname und die E-Mailadresse des Nutzenden eingetragen werden sollen, automatisch füllen zu lassen.
Weitere Informationen zur Vorbelegung der Inputfelder mit IDM-Daten .

Eingabefeld in einem Formular:

Eingabemaske
Vorschau

Die Textarea ist ein mehrzeiliges Texteingabefeld, das Zeilenumbrüche enthalten kann. Es lässt sich hierbei zusätzlich zu den oben genannten allgemeinen Einstellungen Folgendes definieren:

Zeilen
Die Textarea lässt sich hiermit in mehrere Zeilen unterteilen.

Spalten
Die Textarea lässt sich hiermit in mehrere Spalten unterteilen.

Textarea in einem Formular:

Eingabemaske
Vorschau

Mehr hierzu in diesem Artikel .

Durch dieses Formularelement ist es dem Nutzenden möglich, Dateien mitzuschicken. Folgende Einstellungen können für diesen Dateiupload vorgenommen werden:

Validierung
Wird hier „Datei“ ausgewählt (voreingestellt), kann man folgendes bestimmen:

  • Fehlermeldung (optional):
    Von der Standard-Fehlermeldung abweichende Meldung, die ausgegeben wird, wenn der Dateityp oder die Dateigröße nicht mit den geforderten übereinstimmt.
  • Erlaubte Dateitypen:
    Hier kann ausgewählt werden, um was für einen Dateityp es sich bei der hochzuladenden Datei handeln darf. Gängige Bildtypen sind z. B. „*.jpg“ oder „*.png“
    Wird keine Auswahl getroffen, gibt es keine Beschränkung (siehe hierzu Hinweis weiter unten).
  • Maximale Dateigröße:
    Die maximale Dateigröße, welche die hochzuladende Datei nicht überschreiten darf, liegt bei 3000 KB (3 MB). Ein manuell gesetztes höheres Limit sorgt bei entsprechendem Datei-Upload für eine Fehlermeldung.
  • Maximale Dateianzahl:
    Hier kann die maximale Anzahl der Dateien eingestellt werden, die der/die Nutzer*in an das Formular hängen darf.

Serverseitige Blacklist

Zu den Dateiformaten, die nicht in Webforms-Formularen hochgeladen werden können, zählen EXE-Dateien sowie veraltete Office-Formate, die potenziell ausführbare Makros enthalten können.

Durch diese Maßnahme soll verhindert werden, dass Webseitenbesucher möglicherweise virenbelastete Dateien über Webformulare verschicken können. Die Blacklist ist in einer Konfigurationsdatei auf dem Server hinterlegt und kann bei Bedarf von uns erweitert werden.

Unverändert können im Bereich „Validierung“ die erlaubten Dateitypen eines Upload-Eingabefeldes weitergehend eingeschränkt werden.

Datei in einem Formular:

Eingabemaske
Vorschau
Eingabemaske

Indem Sie versteckte Felder verwenden, fügen Sie Informationen in das Formular ein, die dem/der Nutzer*in nicht angezeigt werden. Beim Absenden des Formulars werden diese Informationen zusammen mit denen der anderen Felder übertragen. Wird ein verstecktes Feld beispielsweise mit der Variable ${date} vorbelegt, so können Sie daran anschließend ablesen, wann das Formular aufgerufen wurde.

Wert
In dieses Feld geben Sie den Inhalt des versteckten Felds ein. Dabei kann es sich auch um eine oder mehrere Variablen handeln oder um einen einfachen Text, wie zum Beispiel den Namen des Formulars.
Nähere Informationen und Erklärungen zu Variablen finden Sie im Artikel Berechneter Wert, Bedingungen und Variablen .

Eingabemaske

Bei diesem Element handelt es sich um einen Textabsatz, der dem/der Nutzer*in zwischen den Formularfeldern angezeigt wird. Dies können beispielsweise Hinweise oder Erläuterungen sein. Auch Verlinkungen sind in einem Paragraph möglich.

Text
Geben Sie hier den Text des Paragraphen ein.
Dieser kann mit der sogenannten Markdown-Syntax formatiert werden.
Mehr zur Formatierung von Texten in Webforms

Fett & Kursiv
Hier kann bestimmt werden, ob der gesamte Text fett und/oder kursiv dargestellt werden soll, zusätzlich zu Formatierungen mittels Markdown-Syntax.

Mehr hierzu in diesem Artikel .

Mehr hierzu in diesem Artikel .

Das Layout-Element fasst Formularelemente zu Layout-Gruppen zusammen. Fügen Sie das Layout-Element an einer sinnvollen Stelle zwischen zwei Formularelementen ein.

Dadurch werden jeweils die Formularelemente über und unter dem Layout-Element gruppiert und optisch durch Trennlinien voneinander getrennt.