Anatomy of the Create Form Modal

When you drag and drop the form element to the screen, the "Create Form" modal opens. Firstly, you must select the data source of the form to be created.

The data sources you can select are;

  • Data Table (1): It allows you to easily and quickly create form designs that are connected to the data tables in your data sources, with data saving connections provided.
  • Excel (2): It allows you to create form designs easily and quickly using the columns in an Excel document you have created.
  • Action (3): It allows you to create form designs easily and quickly by using the actions in the application you have developed, in line with the parameters of the actions.
  • Custom (4): It allows you to easily and quickly create various form designs in a customized structure in line with your needs.

Let’s examine the sections on the form detail screen that opens after selecting your data source.

A. Adding Field to Form:

From the Add Field section, you can specify the name of the form structure, customize the variables to be included in the form, change the appearance of the form structure according to device differences, delete variables with three dots and add new fields.

  1. Add Header : This is the field to name the form section.
  2. Section Layout : You can choose how to display the form according to device differences.
  3. Label : This is the field where you can specify the name of the variables in the form field (For example, "roleName").
  4. Field Type : It is the field where you can specify the data type of the variable in the form field (For example, "string").
  5. Element Type: This is the field where you can specify the type of the variable in the form field (For example, "textInput").
  6. Req : It is used for the fields that must be filled in the form.
  7. Add item : You can use it to add a new line to the form.

B. Adding Section to Form

This is the area where you can add new sections to your form.

Add Section : You can use it to add a new section to the form.

C. Save Form

Save : Allows you to save the changes in the form.