1. DE

Display form entries elsewhere in the form

Here you can find out how to display information that users enter into a form at another place in the same form.

As our example, let’s take a registration form for a marketing seminar, which asks the user to input various kinds of information, such as their email address, preferred seminar date and name.

On the last page of the form, all of the data entered in summarised, accompanied by a short introductory piece of text.

So, the idea here is to have the person who has just filled out the form mentioned by name in the introductory text as well as in the subsequent confirmation message.

Step 1: Creating the form

The first step is to create a form for the marketing seminar.

On the first page of the form, we ask the user to enter their first and last name, and their email address. We need the first name for our introductory text and confirmation message, so this field is a required field – as is the field for the email address.

The user is also given a date selection box with various options and a comment field, where they can enter topics that they would like to see discussed in the seminar.

The editor is visible. The marketing seminar form is being edited. So far, it consists of a page with an introductory text, a selection for the seminar as well as personal data queries and a field for individual comments.

Step 2: Data check with personalised greeting

The second page presents a summary of the details entered, which we can do by using the Summary form element.

Above this summary, we add a Paragraph field, where the user is asked to check their input before submitting the form.

To make this request more personal, we address the user by using their first name.

The editor is visible. The second page of the marketing seminar form is being edited. A text paragraph containing a personal salutation is open in the editing area. The technical name 'firstname', enclosed in curly brackets and preceded by a dollar sign, is used instead of a name.

To add this first name to the text – which the user entered on the first page of the form – we need the technical name from the corresponding form field.

The technical name can be found in the associated editing area:

A section of the editor shows the editing area of the 'Short text' form element, in which users are asked to enter their first name. The technical name 'firstname' is highlighted in the editing area with an orange frame.

In the place where the first name needs to be displayed in the paragraph, we enter a dollar sign, followed by curly brackets around the technical name for the first name.

A section of the editor shows the editing area of the 'Text paragraph' form element, which contains a text with a personal salutation. The technical name 'firstname', enclosed in curly brackets and preceded by a dollar sign, is used instead of a name. This is highlighted in the editing area with an orange frame.

Step 3: Confirmation message with personalised greeting

We use the same method for the confirmation message.

At the place in the message text where the first name should appear, we use a dollar sign followed by the technical name for the first name, which we enclose in curly brackets.

In the Settings area, you can see the section where you can enter the confirmation message that will be displayed to the user after submitting the form. A text with a personal salutation can be seen here. The technical name 'firstname', enclosed in curly brackets and preceded by a dollar sign, is used instead of a name in the text. This is highlighted with an orange frame.

When users now complete the form, they are addressed personally in both the text on the second form page and in the confirmation message after submitting the form.

A sequence of three screenshots can be seen: The first shows the first page of the form, with all the fields filled in. The input field for the first name reads 'Max'. An orange arrow points to the second screenshot, which shows the second page of the form. Here is the text with the personal salutation, now with the name 'Max'. From this page, an orange arrow points to the third screenshot. The confirmation message appears here, also with 'Max' in the salutation.