Content Blocks
Sections - Basic, Conditional, Copyable

Sections - Basic, Conditional, Copyable

This is some text inside of a div block.

A section is a wrapper of multiple fields added to an app. They serve two purposes -

  1. Educate users about the nature of fields (modules) inside the section
  2. Put conditions to display/hide all the fields inside the section

Help video

Editing a section

  • Click on a section name to edit it
  • Add a title to the section. You can also remove the default title "Untitled Section" to keep it blank.
  • Click on the Save button.
  • You can add more fields by clicking on the plus icon (that appears on every field of the section) OR by clicking the Add field button at the end of the section and then selecting a suitable block.
  • You can also drag an existing block to change its section

Reorder Sections

Similar to the drag-and-drop action of the blocks, you can also rearrange the sections.

Below example app consists of two sections.

Click on the Other Details section and drag-and-drop it in the place of Basic Details section.

You can see that sections have been rearranged. Other Details section is on top of the Basic Details section.

Help video

Conditional section

This is one of the most useful features that help app creators create very complex apps. You can use this to introduce branching in your apps.

  • Click on a section title to select the section that should appear when some condition is met.
  • Click in the input box under the title "Display this section if" on the right panel.
  • Type @ to fetch all variables of the app.

In the example above, we are adding a condition to show this section only when the user selects Gender as Male.

  • You can also input advanced conditions like IF, ELSE, OR, AND etc. that are supported in Excel. The syntax is exactly what you type in the Excel formula bar. Just in place of the Cell number use @ and call the variables of the app.

Here we are putting a condition to make sure that this section appears only when the person is Male and >18 years of age.

Help video

Copyable section

You can use this feature to collect data from the end-users when the count of input can be variable. For example, you want to collect the details of the family members of the user filling the data.

Click on the section of which you want to create multiple copies. Edit from the Right Panel which appears on the right side.

Enable: Allow Section to be copied

Enable this option to allow creating copes o the section, 'Family Members'

Max Number of copies

Enter a number of how many copies of the section that you want to create

Link text to copy this section

Enter your desired text for the end user to understand that clicking on this will create another copy of that section.

There are 2 ways to do that:

  1. Enter text

In this example, 'Add another member' is the text. You can add your own self-explanatory text. This appears on the bottom right side of the section


  1. Enter custom link text

You can add your own custom link here. Below is an example of a custom link and it's preview.

<h2 style='color: #007BFF;cursor: pointer;text-align:left;'>+ Add another Basic Details section</h2>

In the above link, 'Add another member' can be changed to your own self-explanatory text. This appears on the bottom left side of the section


FAQs - Copyable section

Q: How do I sum up all the values entered by a user when the section is copyable?
A: Add a formula module in another section and use SIGMA({variable_name}) to calculate the sum.

Q: How do I use the values of the copyable section in the print template configuration.
A:  You should use #1, #2, etc. after the variable name to call the values from the 1st section, 2nd section, and so on. For example, if the variable name is {family_member}, you should write {family_member#1} for the name of the first member and {family_member#2} for the name of the second member.

Help video


You can make some sections of the app as sub-sections of any other section in the app. For example, the screenshots below show a Checklist App with 3 main Checklists C1, C2, and C3 and each of them has sub-checklists like 1.1, 1.2. 2.1 etc. So the users filling data in the App will initially see only the 3 top-level sections. Then when they click on one of these sections, their sub-sections will appear.

To create such a setup with sub-sections, follow these steps.

  • First, create all the desired sections. For example, Checklist 1, Checklist 2, Checklist 3 etc.
  • On the right panel, turn ON the option Show advanced options, if it is not already ON.
  • Then select the section to which you want to assign some sub-sections. For example, Checklist Subsections.
  • Click on the drop-down for Sub-sections. You will see a list of all other sections of the app. Select the ones which are going to be the sub-sections of the current section.