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.

mceclip0.png

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 QuickBPM will calculate the total discounted amount.

dynamic_forms.png

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 Widgets on Forms.

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:

  • API for client scripts – API for working with app item forms and forms in business processes.
  • Scripts on Typescript – here you can find information about scripts for working with system objects and external pages.