🇦🇹 Deutsch

Neues Formular erstellen

• Neue Formulare werden über den Bereich Web → Formulare angelegt.

• Durch Klicken auf + öffnet sich ein Dialog, wo einerseits der gewünschte Formularname als auch der Formularspeicher ausgewählt werden muss.

  • Der Formularspeicher ist ein vordefinierter Ort, wo alle Formulardefinitionen abgelegt werden und unterscheidet sich je nach Zugriffsberechtigungen. In der Regel gibts es z.B. pro Institut einen Formularspeicher als auch z.B. für große Bereiche auf den WU-Hauptseiten (z.B. Presse oder Universität).

  • Sofern mehr als ein Formularspeicher verfügbar ist, muss jener ausgewählt werden, wo das Formular dann auch verwendet wird.

  • Bitte verwenden Sie nicht den Formularspeicher kurse_forms, dieser ist rein für TYPO3-Kurse gedacht. Darin abgelegte Formulardefinition können von allen TYPO3-Benutzerinnen und -Benutzern bearbeitet oder gelöscht werden.

  • Sofern kein Formularspeicher bzw. nur der Kurse-Formularspeicher vorhanden ist muss dieser einmalig vom TYPO3-Team angelegt werden. Eine entsprechende Anfrage ist via Service Desk möglich.

  • Formulardefinition, die im Speicher kurse_forms abgelegt werden, werden regelmäßig gelöscht und sind nicht für tatsächlich benötigte Formulare gedacht sondern ausschließlich um etwas auszuprobieren!

• Durch zweimaliges Klicken auf Weiter wird das Formular erstellt und im Formulareditor geladen.

• Ein Formular kann aus ein oder mehreren Schritten bestehen. In der Regel gibt es einen Schritt mit dem tatsächlichen Formular und einen weiteren Schritt (Zusammenfassung) wo die eigegebenen Daten nochmals angezeigt werden und ggfs. bearbeitet werden können.

  • Eine Zusammenfassungsseite wird via Neue Seite → Zusammenfassungsseite angelegt.

  • Auf der Zusammenfassungsseite können noch die Buttons für Vor/Zurück umbenannte werden, z.B. auf "Formular absenden" und "Eingaben korrigieren"

Open

• Auf oberster Ebene des Formulars, bezeichnet mit dem zuvor ausgewählten Namen, müssen die Formular Finisher konfiguriert werden. Ein Finisher ist eine Aktion, die nach dem Abschicken des Formulars ausgelöst werden soll. Wichtig ist hier auch die korrekte Reihenfolge der Finisher analog zur folgenden Aufzählung:

  • Immer an erster Stelle und verpflichtend ist der Finisher Save to Database auszuwählen. Hier muss noch der Haken vor Save to Database sowie unter Storage PID die Nummer 1854 eingetragen werden. Durch diesen Finisher werden jegliche Formulareingaben in der TYPO3-Datenbank gespeichert und können dort bei Bedarf wieder ausgelesen werden. Sofern die Eingaben auch in einer CSV-Datei gespeichert werden sollen (siehe unten) muss auch Save to Filesystem immer ausgewählt werden.

  • E-Mail an Empfänger erlaubt es, eine Bestätigungsmail an eine definierte Adresse, idR einen Verteiler/Sammeladresse zu schicken, um so über neue Formularanmeldungen informiert zu werden. Unter Confirmation Text kann ein individueller Text eingegeben werden, der nach den eigentlichen Formularfeldern in der E-Mail-Benachrichtigung ausgegeben wird.

  • E-Mail an Absender erlaubt es, dem Ausfüller des Formulars ebenfalls eine Bestätigungsnachricht zu schicken um den Eingang zu bestätigen. Unter Confirmation Text kann ein individueller Text eingegeben werden, der nach den eigentlichen Formularfeldern in der E-Mail-Benachrichtigung ausgegeben wird.

  • Mit Weiterleitung zu einer Seite können Formularbenutzer/innen nach dem Abschicken eines Formulars auf eine Seite für weitere Informationen weitergeleitet werden, auf der z.B. zusätzliche Informationen präsentiert werden können. Achtung: Wenn dieser Finisher verwendet wird, so muss er an letzter Stelle der Finisher stehen!

  • Sobald die Finisher eingerichtet sind, kann das eigentliche Formular gestaltet werden.

Open

• Auf einer normalen Seite können via Neues Element erstellen die gewünschten Formularfelder hinzugefügt werden.

Formularelemente

Folgende Elemente stehen zur Verfügung:

• Text: Simples, einzeiliges Textfeld.

• Textfeld: Mehrzeiliges Textfeld.

• Passwort: Textfeld zur Eingabe wobei die Eingabe nicht angezeigt wird.

• E-Mail-Adresse: Textfeld mit Überprüfung auf eine valide E-Mail-Adresse.

• Telefonnummer: Textfeld mit Überprüfung auf eine valide Telefonnummer.

• URL: Textfeld mit Überprüfung auf eine valide URL

• Nummer: Eingabe von ganzzahliger Zahl oder Fließkommazahl.

• Datum: Auswahl eines Datums.

• Checkbox: Auswahlmöglichkeit ja/nein.

• Einfachauswahl: Dropdown zur Auswahl von einem Element aus einer vordefinierten Liste. Wichtig hier ist bei den einzelnen Optionen unter Value ausschließlich einen Wert ohne Sonderzeichen und Leerzeichen einzugeben.

• Auswahlknopf: Auswahlmöglichkeit von genau einer Option von mehreren.

• Mehrfachauswahl: Auswahl mehrerer Elemente per Checkbox. Wichtig hier ist bei den einzelnen Optionen unter Value ausschließlich einen Wert ohne Sonderzeichen und Leerzeichen einzugeben.

• Dateiupload: Erlaubt das Hochladen von Dokumente. Eine Einschränkung auf Basis des Typs (z.B. docx oder pdf) ist möglich.

• Bildupload: Erlaubt das Hochladen von Bildern in unterschiedlichen Formaten.

• Statischer Text: Anzeige von statischen Textinhalten im Formular zu Informationszwecken

• Feldgruppe: Dient zur Gruppierung einzelner Elemente zu einer Gruppe, beispielsweise bei Anmeldeformularen alle Felder zu einer Person.

Alle Elemente können jeweils als Pflichtfeld deklariert werden sowie mit Validatoren (z.B. muss eine ganzzahlige Zahl sein) versehen werden.

Formulare auf Seiten einbinden

• Sobald ein Formular wie oben beschrieben fertig gestaltet wurde, kann es auf der gewünschten Seite eingebunden werden.

• Dazu wird auf der gewünschten Seite ein neues Inhaltselement vom Typ Form hinzugefügt und im Reiter Plugin die soeben erstellte Formulardefinition ausgewählt.

• Sofern das Formular die Möglichkeit zu Dateiuploads bietet und diese auch in TYPO3 abgelegt werden sollen, muss unter Where to store optional file attachments? ein entsprechender Ordner ausgewählt werden.

• In der Regel sollen die eingegebenen Formulardaten nicht nur in der Datenbank gespeichert und eventuell per Mail verschickt werden sondern insbesondere auch zur weiteren Verarbeitung in z.B. Excel in einer Datei gespeichert werden. Dazu dient die Option Select CSV File (new data will be appended.). Die gewünschte CSV-Datei muss hier zuerst in der Dateiliste angelegt und kann dann hier ausgewählt werden.

CSV-Datei in Dateiliste erstellen

Falls noch keine CSV-Datei existiert muss diese zuerst in der Dateiliste erstellt werden:

• Bitte wechseln Sie dazu links im Menü auf Dateiliste und wählen Sie ggfs. einen Ordner aus, in dem die CSV-Datei gespeichert werden soll. Im Beispiel Mentoring.

• Über das Plus-Symbol können neue Datensätze, darunter auch Textdateien wie eine CSV-Datei, angelegt werden.

• Im nächsten Dialog kann unter Filename / Dateiname der gewünschte Name, im Beispiel mentoring.csv, eingegeben und erstellt werden.

• Diese CSV-Datei kann nun wie oben beschrieben beim Einbinden des Formulars referenziert werden.

Videoanleitung

Download einer .csv Datei und Import in Excel

Die Funktion der .csv Datei, die mit Ihrem Formular verknüpft sein kann, ist jene, dass für jedes eingehende, ausgefüllte Formular eine Zeile mit den Daten in der .csv Datei geschrieben wird - damit haben Sie ein Backup zusätzlich zu der E-Mail, die mit den Formulardaten verschickt wird. Das nachfolgende Video dokumentiert, wie dieser Download vonstatten geht und wie Sie die .csv Datei dann in Excel importieren können, um mit den Daten weiterzuarbeiten.

🇬🇧 English

From TYPO3 Version 9 onwards, all forms are administered centrally in one area and edited with a new form editor. The form definitions created here can then be integrated on one or more TYPO3 pages.

Creating a new form 

• New forms are created via the section Web → Forms.

• Clicking on + opens a dialog where the desired form name ("Formularname") as well as the form storage ("Formularspeicher") must be selected.
  
  

  • The form storage is a predefined location where all form definitions are stored. It differs depending on access permissions. Usually, there is one form storage for each institute as well as for large areas on the WU main pages (e.g. press or university).

  • If more than one form storage is available, the one where the form will be used must be selected.

  • Please do not use the form storage kurse_forms, this is intended purely for TYPO3 courses. Form definitions stored there can be edited or deleted by all TYPO3 users.

  • If there is no form storage, or only the course form storage, it has to be created once by the TYPO3 team. A corresponding request is possible via the Service Desk.

  • Form definitions that are stored in the kurse_forms storage are regularly deleted and are not intended for forms that are actually needed but only to try something out!

• By clicking Next twice, the form is created and loaded in the form editor.

• A form can consist of one or more steps. Usually there is one step with the actual form and another step (summary) where the entered data is displayed again and can be edited if necessary.

  • A summary page is created via New page → Summary ("Neue Seite → Zusammenfassungsseite") page.

  • On the summary page you can rename the buttons for Forward/Back, e.g. to "Submit form" and "Correct input"
    
    
    

• At the top level of the form, designated by the name selected before, the Form Finisher must be configured. A finisher is an action to be triggered after the form has been submitted. The correct order of the Finishers is also important here, similar to the following enumeration:
  
  

  • First of all, and always obligatory, the Finisher Save to Database must be selected. Here you have to check Save to Database and enter the number 1854 under Storage PID. With this finisher, all form entries are stored in the TYPO3 database, where they can be read out again if necessary. If the entries are also to be saved in a CSV file (see below), Save to Filesystem must always be selected.

  • E-mail to recipient allows to send a confirmation e-mail to a defined address, usually a distribution list, to be informed about new form registrations. Under Confirmation Text an individual text can be entered, which will be displayed after the actual form fields in the e-mail notification.

  • E-mail to sender allows you to send a confirmation message to the person filling out the form to confirm that the form has been received. Under Confirmation Text an individual text can be entered which will be displayed after the actual form fields in the e-mail notification.

  • With Forward to page, form users can be redirected to a page for further information after submitting a form, where e.g. additional information can be presented. Attention: If this finisher is used, it must be the last finisher on the page!

  • Once the finishers are set up, the actual form can be designed.

• On a normal page, the desired form fields can be added via Create New Element.
  
  

Form elements

The following elements are available:

• Text: Simple, single-line text field.

• Textarea: Multi-line text field.

• Password: Text field for input (the input is not displayed).

• Email address: Text field with check for a valid e-mail address.

• Telephon number: Text field with check for a valid phone number.

• URL: Text field with check for a valid URL.

• Number: Input of integer or floating-point number.

• Date: Selection of a date.

• Checkbox: Selection option yes/no.

• Single select: Dropdown to select an element from a predefined list. Important here is to enter only a value without special characters and spaces for the individual options under Value.

• Radio button: Choice of exactly one option out of several.

• Multi checkbox: Selection of multiple elements by checkbox. It is important to enter a value without special characters and spaces for the individual options under Value.

• File upload: Allows you to upload documents. A restriction based on the type (e.g. docx or pdf) is possible.

• Image upoad: Allows the upload of images in various formats.

• Static Text: Display of static text content in the form for information purposes

• Fieldset: Serves to group individual elements into a group, e.g. for registration forms all fields for one person.

All elements can be declared as mandatory fields and can be provided with validators (e.g. it must be an integer number).

Integrate forms on pages

• As soon as a form is finished as described above, it can be integrated on the desired page.

• This is done by adding a new content element of the type Form on the desired page and selecting the form definition just created in the Plugin tab.

• If the form offers the possibility of file uploads, and these are to be stored in TYPO3, a corresponding folder must be selected under Where to store optional file attachments?

• Usually, the form data entered should not only be stored in the database and possibly sent by e-mail, but also saved in a file for further processing in e.g. Excel. For this purpose the option Select CSV File (new data will be appended) is used. The desired CSV file must be created in the file list first and can be then be selected here.

Create CSV file in file list

If a CSV file does not yet exist, it must be created in the file list:

• To do this, please switch to the File list in the menu on the left and, if necessary, select a folder in which the CSV file is to be saved. Example: Mentoring.

• New data sets, including text files such as a CSV file, can be created via the plus symbol.

• You can enter and create the desired name, for example mentoring.csv, in the next dialogue under File name.

• This CSV file can now be referenced as described above when integrating the form.

Video tutorial

Download a .csv file and import into Excel

The function of the .csv file that can be associated with your form is that for each incoming completed form, a line of data is written to the .csv file - so you have a backup in addition to the email that is sent with the form data. The video below shows how this download is done and how you can then import the .csv file into Excel to work with the data.