Table of Content
Still need help?
Request support
Request Support
HELP
 / 
 / 
Data Input Blocks
 / 

Dropdown

This article explains the features of the Dropdown block and how it can be used to design your app.

Dropdown

Use Cases

  1. Selecting a value from a pre-defined set of values
  2. Dependent Dropdowns or Connecting dropdowns

Help Video

Editing the Block

Click on the block and configure it by editing on the right panel.

Dropdown

Label

The label is the name of the block that the end user sees in the app.

Example: Department. 

Description

The description is the additional information provided to the end user which will be displayed below the input area.

Example: Select the appropriate option.

This is how the Dropdown block with the label and the description will look to the end user.

Dropdown

Required

Enable this option if you want the user to compulsorily input the data. If enabled, the end user can submit if and only if the data is entered in this field.

Allow value to be changed after initial submission

This option is enabled by default. End users can edit the value entered in this field after creating a submission. Disable it if you do not want the end users to edit the submitted value.

Example: Between Student and Teaching Staff when the end user selects Teaching staff and creates a submission, the end user can go to the submission and change it to Student.

Advanced options

Use this option to show the advanced options to configure the dropdown text block.

Dropdown

Dependency fields

Dependency fields are the different levels of dependencies (Level 1 dependency, Level 2 dependency...) on various dropdowns.

In simple words, when the end user selects an option first dropdown, then the second dropdown will only show the options corresponding to the selection and so on.

The General format:

<value 1 from the first dropdown>||<value 1 to be shown against this selection>↵ Press Enter key

<value 1 from the first dropdown>||<value 2 to be shown against this selection>↵Press Enter key

<value 1 from the first dropdown>||<value 3 to be shown against this selection>↵Press Enter key

<value 2 from the first dropdown>||<value 1 to be shown against this selection>↵Press Enter key

<value 2 from the first dropdown>||<value 2 to be shown against this selection>↵Press Enter key

<value 2 from the first dropdown>||<value 3 to be shown against this selection>↵Press Enter key

Dropdown

Example for Dependency fields:

1. In the first dropdown i.e., Country, Enter India and USA as options

Dropdown

2. In the second dropdown i.e., City, enter the city names corresponding to the country as shown below:

India||Bengaluru

India||Mumbai

India||Chennai

USA||New York

USA||San Francisco

USA||Manhattan

Dropdown

Dropdown

Preview:

Dropdown

Dropdown

Allow multiple selections

Allow users to select multiple options from the dropdown

Dropdown

Display this field if

Use this if you want to show or hide a field under certain conditions. It accepts the standard Clappia Formulae, similar to conditional sections.

  1. You can type ‘@’ to get a list of all the variables in the app and select variables.
  2. Using these variables you can write Excel-like formulae.

Example: Between Student and Teaching Staff when the end user selects Teaching & Non-Teaching staff, you can show the Department field.

Dropdown

Preview:

Dropdown

Dropdown

FAQs
Can multiple options be selected in the dropdown?

Yes, enable 'Allow multiple selections' under the Advanced section of this block.

Is it possible to show a secondary dropdown in the app, but only when a selection is made in the initial dropdown block?

Yes, to have nested dropdowns, the secondary dropdown that should appear should be configured accordingly in the Advanced option. For more information: https://www.clappia.com/help/nested-drop-downs-multi-level-drop-downs

Try our free plan
It will answer many more questions within just 15 minutes.