JGU Forms Generator

The plugin JGU forms generator will be activated for your WordPress project on request. Please write a mail to webmaster@uni-mainz.de, mentioning the name/address of the blog for which you would like the forms generator to be activated.

After activation, form shortcode may be entered into the WordPress text editor (mode: Text) in any post or page. For a short introduction, please see this -> schedular overview of form shortcodes and the resulting form fields.

Using the JGU forms generator together with JGU-Auth

If a user is authenticated via JGU-Auth, your web form will not display any captcha (which would otherwise be necessary as a precaution against spam bots). Additionally, certain information about the authenticated user may be automatically embedded into form input fields by using the attribute 'benutzerdaten'.

Example: creating a simple form

We recommend to always use the editor's text mode for entering shortcode. Please find the tab switch for this mode in the upper right of the editor box in your dashboard.

Important: Please do not format shortcode (i.e.: do not mark it as bold or italic etc.). Please enter the shortcode unformatted: use the 'text' mode of the text editor for entering/changing shortcode, NOT the 'visual' mode.

As a first introduction, please copy the following shortcode into your page or post:

[formulargenerator ueberschrift="My first web form" mailadresse="yourmailaddress"] [radiobuttons ueberschrift="Your registration to our course"] [radiobutton titel="Couse No 1 (Prof. X)" vorausgewaehlt="JA"] [radiobutton titel="Course No 2 (Prof. Y)"] [/radiobuttons] [eingabefeld ueberschrift="Mail address"] [/formulargenerator]

Save the post/page and view the page in the frontend. It should look a bit like this:

simple_form

Explanation: In the example above we first define a title (ueberschrift) for the form. The shortcode formulargenerator is like an outer bracket that holds the whole form and needs to be closed at the end. The attribute mailadresse holds the mail address to which the content of the form should be mailed once someone fills it out.
Next is a box with two so-called radiobuttons.
Underneath that we added a simple input field for a mail address, to which a confirmative mail holding the registration data could be sent.

You think you can do this, too? Then send a mail to webmaster@uni-mainz.de and have the forms generator activated for your blog.

What to do with posted form data?

The data entered into and sent with your form will be written into a database table. You can also have the form data sent to a mail address that you provide, and have a confirmation mail with all form data be sent to the person who filled out the form, if they have provided their mail address. After the form is posted, a standard confirmation page with all posted form data will automatically be shown. Alternatively, you may provide a link to another web page as your own confirmation page.

  • If you just need access to the form's database table (and might like to export the data to Excel or similar software): you will find a 'Link to form data table' underneath the form in the frontend view. You will be able to access the form data table after you have added your JGU user account name to the attribute 'benutzer' for the form:
    [formulargenerator benutzer="YourJGUUserAccountNameHere"]
  • Send form contents to mail address:
    [formulargenerator mailadresse="EnterJGUmailaddress"]
  • Send form contents to mail address AND be able to access the form data table:
    [formulargenerator mailadresse="EnterJGUmailaddress" benutzer="YourJGUUserAccountNameHere"]
  • Send confirmation mail to user's mail account:
    [eingabefeld ueberschrift="Your mail address" bestmailadresse="JA"]
  • use another web page as confirmation web page:
    [formulargenerator bestseite="http:/YourAlternativeURL"]

Form fields: shortcodes, attributes and values

JGU web forms are set up and defined by writing shortcode. WordPress shortcode consists of a predefined term set inside square brackets and complemented by attribute/value pairs. The shortcode is interpreted by WordPress to display the intended view/functionality for your frontend users:
[shortcode attribut1="wert1" attribut2="wert2"][/shortcode]

Most attributes are optional, i.e. they do not have to be present in the shortcode. Default values will be provided by the system if necessary.

formulargenerator

This is the 'outer bracket' for your form. Inside this, you may use the following shortcodes:

  • eingabefeld (an input field consisting of one text row only)
  • meingabefeld (an input field with with more than one text row)
  • auswahlliste (a drop-down menu)
  • radiobuttons (an input field consisting of radio buttons, allowing the user to choose only one out of a predefined set of options, an exclusive or)
  • checkboxes (an input field consisting of boxes to be checked, that allows the user to check more than one option)

The following attributes may be used for your form's general settings:

  • ueberschrift (title seen above the form, optional),
  • mailadresse (mail address to which the form content should be sent, optional),
  • bestseite (the URL of any other page used as a confirmation page after the form has been submitted, in case you want something else than the automatic confirmation page, optional),
  • suchseitegeschuetzt (should access to the form data table be limited to certain users or public? By default, access to the form data table is limited only to specifically named users, see below),
  • benutzer (JGU user account names who are allowed access to the form data table. Several users may be separated by semicolons, optional)

Here's an example using all available attributes:

[formulargenerator ueberschrift="Title of your form" mailadresse="slowi@uni-mainz.de" bestseite="http://www.staff.uni-mainz.de/slowi/bestaet.html" suchseitegeschuetzt="0" benutzer="slowi; teststlow; mbehrens"]

auswahllliste

A drop-down menu for choosing one or multiple elements from a list. This shortcode always has nested elements called 'listeneintrag' for the single menu items. 'auswahlliste' is the outer bracket. It may have the following attributes:

  • ueberschrift (title seen above the drop down menu, optional),
  • einleitung (an introductory text for the menu list, optional),
  • beschreibung (some more text describing the menu list, displayed on the right of the menu, optional),
  • listenlaenge (defines how many menu items of the list will be visible when clicking on it, the default value is 1, optional),
  • auswahl ('multiple' or left empty: if this attribute is set to 'multiple', then several menu items can be selected at once. Optional. Default value for this attribute: it is left empty).

listeneintrag

May only be placed inside a bracketing 'auswahlliste'. Attributes:

  • titel (title of the menu items, this should not be left empty),
  • vorausgewaehlt (NEIN/JA, defines whether a menu item is displayed as preselected, optional, default value is 'NEIN' = NO).

Here's an example using all attributes:

[auswahlliste ueberschrift="Title of the dropdown menu" einleitung="These hints get displayed above the menu list"  beschreibung="This could describe what the options of the menu might mean"] [listeneintrag titel="Title of menu item 1"  vorausgewaehlt="JA"] [listeneintrag titel="Title of menu item 2"  vorausgewaehlt="NEIN"] [listeneintrag titel="Title of menu item 3"  vorausgewaehlt="JA"] [/auswahlliste]

eingabefeld

A simple input field consisting of one text row only. The following attributes may be used:

  • ueberschrift (title of the input field, optional),
  • anzeigelaenge (number of characters displayed inside the input field, optional, default value is '50'),
  • maxzeichen (maximum number of characters that may be entered into this field, optional, default value is '50'),
  • pflichtfeld (defines whether the input field has to be filled out, optional, default value is 'NEIN' = NO),
  • einleitung (an introductory text for the input field, optional),
  • vorbelegung (preallocated text, optional),
  • feldbeiklickleeren (defines whether text within the input field should be cleared on mouse click inside the field, optional, default value is 'JA' = YES),
  • valtyp (defines the type of validation check that will be applied to the input. Available types: FREI (= FREE, no validation check) or DATUM (= DATE) or EMAIL or UNIMAIL (= any JGU mail address) or URL or PLZ (= Postleitzahl, post code) or TELEFON (= telephone number). Optional, default value is 'FREI' = FREE = no validation check),
  • bestmailadresse (defines whether a confirmation mail should be sent to the mail address entered in this field, optional, default value is 'NEIN' = NO),
  • antwortadresse (defines whether a mail address entered into this field should be added to the Reply-To-Header of the confirmation mail. Optional, default value is 'NEIN' = NO),
  • verschluesseltindb (NEIN/JA. Defines whether input enterend into this field should be saved in the database in an encrypted format. Optional, default value is 'NEIN' = NO),
  • typ (text/password/hidden, defines the type of input that may be entered into this field. Optional, default value is 'text'),
  • zugriff ('readonly' or empty. Defines whether a user is allowed to enter anything into this field by himself. Optional. By default this value is empty so any user can enter input into the field).
  • benutzerdaten (mail/matrikel/vorname/nachname/vorname nachname. This allows you to automatically embed certain data of an authenticated user into the input field, so that the user does not have to enter them himself. The plugin JGU-Auth has to be activated for your blog to use this.)

Here's an example using all attributes:

[eingabefeld ueberschrift=E-Mail" anzeigelaenge="60" maxzeichen="80" pflichtfeld="JA" einleitung="We need you mail address to notifiy you of subsequent changes" vorbelegung="user@uni-mainz.de" feldbeiklickleeren="NEIN" valtyp="EMAIL" bestmailadresse="JA" antwortadresse="webmaster@uni-mainz.de" verschluesseltindb="JA" typ="text" zugriff="readonly" benutzerdaten="mail"]

Validation checks for input into this field

May be added via the attribute valtyp .
The following types are available:

  • FREI: Default = no validation check is applied
  • DATUM: TT.MM.JJJJ, i.e. 01.01.2013
  • EMAIL: has to contain a @, followed by a valid domain
  • UNIMAIL: has to contain a @, followed by ... uni-mainz.de
  • UNINOSTUDENT: has to contain @[...]uni-mainz.de, but may not contain @students.uni-mainz.de
  • URL: a valid web address
  • PLZ: 5 digits
  • TELEFON:  DIN 5008, '+' for international country codes and '-' for phone extensions. Dots, brackets and slashes are not allowed.

meingabefeld (= multiple text row input field)

Use this to offer long(er) text inputs. The following attributes are available:

  • ueberschrift (title of the input field, optional),
  • anzeigelaenge (the number of characters in each row of the input box, optional, default value is '50'),
  • zeilen (the number of rows in the input box, optional, default value is '3'),
  • pflichtfeld (defines whether the input field has to be filled out, optional, default value is 'NEIN' = NO),
  • einleitung (an introductory text for the input field, optional),
  • vorbelegung (preallocated text, optional),
  • feldbeiklickleeren (defines whether text within the input field should be cleared on mouse click inside the field, optional, default value is 'JA' = YES),
  • valtyp (defines the type of validation check that will be applied to the input. Available types: FREI (= FREE, no validation check) or DATUM (= DATE) or EMAIL or URL or PLZ (= Postleitzahl, post code) or TELEFON (= telephone number). Optional, default value is 'FREI' = FREE = no validation check),
  • zugriff ('readonly' or empty. Defines whether a user is allowed to enter anything into this field by himself. Optional. By default this value is empty so any user can enter input into the field).

Here's an example using all attributes:

[meingabefeld ueberschrift="Your comment"  anzeigelaenge="20" zeilen="10" pflichtfeld="JA" einleitung="We want your opinion!" vorbelegung="I like: ... I don't like: ..."  feldbeiklickleeren="NEIN" valtyp="EMAIL" zugriff="readonly"]

checkboxes

Checkboxes are ideal for letting the user choose one or more options out of a given set.

  • ueberschrift (title of the checkbox field, optional),
  • einleitung (an introductory text for the list of checkboxes, optional),

The shortcode 'checkboxes' always has nested elements called 'checkbox' for the single menu items. 'checkboxes' is the outer bracket. The single checkbox items inside it may have the following attributes:

  • titel (title of the single checkbox, this should not be left empty),
  • vorausgewaehlt (NEIN/JA, defines whether a menu item is displayed as preselected, optional, default value is 'NEIN' = NO).

Here's an example using all attributes:

[checkboxes ueberschrift="Ihr Lieblingseis" einleitung="mehrere Antworten möglich"] [checkbox titel="Vanille" vorausgewaehlt="JA"] [checkbox titel="Mokka" vorausgewaehlt="JA"] [checkbox titel="Stracciatella" vorausgewaehlt="JA"] [/checkboxes]

radiobuttons

Use radiobuttons if you would like the user to choose only one out of a predefined set of options..

  • ueberschrift (title of the field of radiobuttons, optional),
  • einleitung (an introductory text for the field of radiobuttons, optional),

The shortcode 'radiobuttons' always has nested elements called 'radiobutton' for the single menu items. 'radiobuttons' is the outer bracket. The single radiobutton items inside it may have the following attributes:

  • titel (title of the single radiobutton, this should not be left empty),
  • vorausgewaehlt (NEIN/JA, defines whether a menu item is displayed as preselected, optional, default value is 'NEIN' = NO).

Here's an example using all attributes:

[radiobuttons ueberschrift="Your favourite ice cream" einleitung="Please choose"] [radiobutton titel="Vanilla" vorausgewaehlt="JA"] [radiobutton titel="Chocolate"] [/radiobuttons]

The form data table

After authenticating for access to the form data table you will see a searchable version of your form with two buttons underneath: 'Zurücksetzen' and 'Suchen'. 'Zurücksetzen' will reset anything you entered into the search form. You may use the form to search for specific data present in the table of all user inputs.
Be default, all data ever collected by your web form will automatically be shown underneath this search form.

Display/download form data

Standard output of your searches is display as HTML within your search page.

Standard ist die HTML-Ausgabe (Webseite). You may also choose 'trennzeichen-separierte Liste' to get an export that is usable in Exel or Access.
There may be cases when such an export will be difficult to import: for example, of a form allowed multiple row input fields where users enter really long texts. In that case it may be an alternative to just use the HTML output since most applications these days are able to import HTML.

The row 'GESENDET' in the form data table will diplay the exact date when that particular data set was posted by the user of your form.

Deletion of JGU web forms and form data tables

Pleaese note: if you delete a post or page containing a web form from the 'trash' bin inside WordPress, this will also delete the form data table and all of its content - finally and irretrievably.

But as long as a post or page containing a web form is still visible inside the trash bin in WordPress, you can easily restore the form data table and all of its content simply by 'restoring' the post or page from the trash bin.

Avoiding mistakes

Always use the 'text' mode of the text editor (as opposed to the 'visual' mode) if you enter or change shortcode.

mutliple is not the same as multiple, and don't forget the double quotes around attribute values 🙂

Don't use line breaks between different attribute values. These should just be separated by blanks.

So, not like this:
[auswahlliste
ueberschrift="Title of this dropdown list"
einleitung="These hints are displayed above"
beschreibung="Describe what the user's choices mean"
listenlaenge="3"
auswahl="multiple"]

But like this:
[auswahlliste ueberschrift="Title of this dropdown list" einleitung="These hints are displayed above" beschreibung="Describe what the user's choices mean" listenlaenge="3" auswahl="multiple"]