Low-Code Designer > Custom forms / Dynamic Form

Dynamic Form

Dynamic forms change in real time depending on user input. You can configure dynamic forms for business process tasks and app items. Such forms allow you to hide excessive fields and show them only when necessary.

How it works

Suppose a company sells office furniture. They keep track of all the client orders using a special app. Each order has its own page in the system that displays such information as Description, Quantity, Price, and Total.

DF1

If the total order amount is more than 250 USD, the company gives customers a discount. As soon as the sales rep specifies the Total amount more than 250 USD, an additional Discount field will automatically appear on the page. The sales rep will write down the discount, and ELMA365 will calculate the total discounted amount.

DF2

How to set up a dynamic form

Dynamic forms are configured using the Code widget. You can use this widget both on task forms and app item forms.

The widget is added to the task form in the form editor. You can read more about how to set up a custom task form, add and configure widgets in the following articles: Form Templates and Interface Designer.

The Code widget is added to the app item form in the advanced mode. Please note that only the creation and editing forms can be made dynamic since these are the forms used for the data input.

In the Code widget, you can write a script which will implement the necessary logic. To do so, we recommend that you read the following articles:

 

Filtering on a dynamic form

 

Filtering associated app fields makes it easier for the user to work with the form when filling it out. Let's say an employee fills out a contract form and  indicates a contact person from the Contacts app. To prevent an employee from looking for the right representative in a long list of contacts, you can set a filter in the form settings. For example, show only those contacts that have the Active box checked or only those who were initially added to the system by the current user.

This will reduce the list of app items available for selection.

Filtering is configured in a sew steps:

  1. Add a new property of the App type to the contract form and select the Contacts app.
  2. In its settings, check the «Restrict choice» box, and then click Configure conditions.df3
  3. In the window that opens, click on the +Filter button. Then click on the Not defined link and select from the list of fields the one by which the Contacts will be filtered. So, select the Author field, and then check the Current user box next to it. Thus, in the list of contacts available for selection, the user will see only those created by him or her.
  4. Add additional filters as needed, for example, filtering by address.df4

Click Save. Now, when filling out a new contract form, in the Contact field, the user will be able to indicate a contact person who he or she added to the system  and whose address contains the city of London.