How to Create a Form

The Form Builder allows you to construct your own form and tailor it to your specific needs. 

1. Select the 'Forms' icon from the left-hand navigation panel.

2. Enter the name of the form you wish to create.

3. All the components and the form creation board are located on the right side of the form components.

 

4. Click on the Data Component tab and select the "Container" sub-component. Click and hold the component, drag it to the main form creation area, and release it.

• Do not alter the name/label of the container.
• Only one container may be used per form, with all other components placed inside it. 
• Click "Save" on the Container Component to add the container to the form.

 

 

The following step (5) is optional. Panels are used to divide a form into sections, allowing data to be hidden or shown as it is filled out. The panel component is also useful for conserving space when designing lengthy or complex forms. Simple forms typically do not require panels, so you may skip to step (6). If you choose to use panels, proceed to Step (5).5. Click on Layout Component tab and select a subcomponent "Panel". 

5. Click on the Layout Component tab and select the "Panel" sub-component. Click and hold the component, drag it to the main form creation area, and release it. 

 

5a. Update the title as desired.

5b. Check the "Collapsible" option.

5c. Click "Save" on the Panel Component. Multiple panels can be added to a form as needed.

 

 

Panel is now added to the form. 

 

 

  

6. Add a column under the panel; this is a prerequisite before adding any other components within a panel. To add columns, click on the Layout category, which will display a list of all sub-components. You will find the "Columns" component under the Layout category. To add columns to a form, click and hold the component, drag it to the main form creation area, and release it. 

 

 

 

The Columns Settings will appear. Here, you can specify how many columns you want. Click on "Add Columns" under Columns properties to add more columns. Ensure that the cumulative value of all the columns equals 12 or less. (It is not recommended to use more than 4 or 5 columns per row, as condensing too much data into a small space can make it difficult to read and understand).  

 

For example, in the following example, you can add three components in a single row. 

 

Click the "Save" button.

 

 

7. Click on the Basic Components tab to view all the sub-components under the Basic category. Similarly, you can click on other component categories to select your desired component. Click and hold the Text Field component, drag it to the main form creation area, and release it. 

7a. Create a heading, such as 'Name,' by entering it in the 'Label' box. 

 

7b. Adjust the position of the label using the options in the 'Label Position' dropdown menu. 

7c. Use the placeholder setting to add text that will appear in the field when it's empty. 

7d. You can preview the changes on the right-hand side. 

7e. Click 'Save.' 

8. Continue adding columns and components until the form is complete. 

9. Click the 'Save' button when finished. The form will now be saved under 'My Forms.' 

10. Navigate to the 'My Forms' tab. Your newly created form will be listed on the left panel. Click on the form to view its details.