Instructions: Create dynamic form

AFS forms have dynamic functions that can be configured depending on the desired purpose. For example, it is often the case that different data needs to be requested when a natural person or a legal entity submits an application. To avoid having to laboriously create multiple forms, AFS can display the correct elements or hide those that are not required, depending on the selection.

The example shown shows you in just a few steps how easy it is to add dynamics to an online form so that only the required data is requested after selecting the person submitting the application.

Step-by-step instructions:

Step 1: Log in to the aforms designer:

Figure 1: Login window aforms designer

Step 2: Select form:

In the current example, we are dealing with the "Dynamic_form_demo_empty" form, which already offers the person type (natural or legal) for selection in the first block, but also requests data for the person type not selected in the next block. Depending on the selection, the block that is not required should now be hidden. To do this, first open the "Dynamic_Form_Demo_Blank" form via the preview icon next to the name and select natural or legal person. You will see that without dynamically hiding the unnecessary data, it is not clear which data must be entered by the applicant.

Abbildung 2: Voransicht des Formulars öffnen

Figure 2: Opening the form preview

Abbildung 3: Voransicht des Formulars „Dynamisches_Formular_Demo_Leer“

Figure 3: Preview of the "Dynamic_Form_Demo_Blank" form

Under the "Extender" item, click on the add icon and select the extender "Form: Set flow dynamically"

Step 3: Configure extender: Hide "Legal entity"

Under "Extender", click on "Add" and select the extender "Form: Define process dynamically"

Figure 4: Adding a new extender

Configure the extender here. First check the "Manual purpose" box and name it in the "Purpose" field. This will help you later to immediately see in the overview what function the extender should fulfill. In this case, it is called "Hide legal entity", as the two blocks belonging to the legal entity should be hidden if "natural person" is selected.

Now select the item "Person (submitting the request)" under "Formula" under "Variable" using the symbol to the right of the field. Below this, enter the condition that this variable must fulfill. In this case, we enter "=#V1!="2"" to indicate that if the first entry on page 1 is selected, the extender will execute something. Now click on the "Hide elements" box under "Fulfilled conditions".

Abbildung 5: Extender Konfiguration „Juristische Person ausblenden“

Figure 5: Extender configuration "Hide legal entity"

Now you have told the extender that it should hide elements when the condition is met. Under "Target blocks", you can now define what these are. Click on the symbol to the right of "Prevent display" and select the block "block_legal_person_V1_0". As you want to hide a second block, add another item "Prevent display" via the add icon and select the block "block_contact_person_V1_0" as before. Once you have done this, click on the Apply icon.

Abbildung 6: Extender Konfiguration „Juristische Person ausblenden“

Figure 6: Extender configuration "Hide legal entity"

Step 4: Configure extender: Hide "Natural person"

In the next step, create the same extender again to hide the "Natural person" block when selecting "Legal entity". To do this, create another extender "Form: Define process dynamically" as in step 4. Again, tick the "Manual purpose" box and then enter "Hide natural person" in the "Purpose" field below. Again, this is just for clarity so that you know later what the extender has been configured for.

Select "Person (submitting the application)" again under "Variable" and now enter the formula "=#V1!="1"" as a condition. As before, this queries which selection was chosen on page 1. In this case, the extender becomes active if the selection "Legal entity" has been selected.Check the box "Hide elements" again and select the block "block_Natural_Person_V1_0 (Natural person)" under "Prevent display" under "Target blocks". Click on the Apply icon.

Abbildung 7: Extender Konfiguration „Natürliche Person ausblenden“

Figure 7: Extender configuration "Hide natural person"

Step 5: Finished form

After you have clicked on Save, you are back in the form overview. Click on the synchronization icon to synchronize the changes with the server. Then click on the eye icon next to the "Dynamic_form_Demo_blank" form again to call up the form.

Abbildung 8: Formular auf Server abgleichen und Voransicht

Figure 8: Synchronize form on server and preview

The form now shows, depending on the selection only the relevant block or blocks. the blocks.

Get AFS demo access now!

Request AFS access data without obligation and test it yourself.

Request access