How do I create a multi-level or cascading dropdown menu?

The "Multiple-level select" field (also known as a cascading or dependent dropdown) allows you to create a series of interconnected dropdown menus. When a user makes a selection in the first dropdown, the options in the second dropdown are updated accordingly. This is useful for organizing hierarchical data like locations, product categories, or time zones. This feature supports up to 4 levels of hierarchy.

Step-by-Step Instructions:

  1. Prepare Your Data: Organize your hierarchical data. The levels should be separated by a forward slash (/).

    For example: Category/Sub-Category/Item. Example Data:

    • Electronics/Computers/Laptop
    • Electronics/Computers/Desktop
    • Electronics/Phones/Smartphone
    • Clothing/Men/Shirts
    • Clothing/Women/Dresses
  1. Add the Field: In the form builder, go to the "Basic Fields" section and click on "Multiple-level select" to add it to your form.
  2. Open the Setup: Click the "Edit" button on the field. In the settings panel on the right, click the hyperlink that says "Setting up multi-level selections".

  3. Enter Your Data: A pop-up window will appear. Paste your hierarchical data into the text box. Each complete path should be on a new line. The first line should define the titles for each level, also separated by /.

    Example Input:

    • Category/Type/Product
    • Electronics/Computers/Laptop
    • Electronics/Computers/Desktop
    • Electronics/Phones/Smartphone
    • Clothing/Men/Shirts
    • Clothing/Women/Dresses
  1. Save: Click the "Save" button.
  2. Preview: Your form will now display a series of dropdowns that update based on the user's selections. Use the "Preview" button to test the functionality.

Related Articles