JotForm User Guide / Advanced Features /

How to configure the Dynamic Dropdown widget?

How to configure the Dynamic Dropdown widget?

Dropdown fields are easy to use, because of the simplicity of picking an option from a list. What if you want to create a list with a nested list? What if you wanted to limit the options that can be selected from a dropdown list depending on what the form user selected earlier?  It is now possible with the dynamic dropdowns widget.

Setting up the Dynamic dropdown widget doesn't need to be knowledgeable with creating an HTML list. The following steps would help you do it:

1. In the form builder, search for the Dynamic Dropdown under the Widgets tab and click on it to add in the form.


2. Set up the list according to your preferences. 


To create a parent-child relationship, you must indent the value by space. Here's for an example:

Main Options:

Option 1

Option 2

Option 3

If you want to add a child under Option 1, add a new line under it and begin adding the child with a single space.

Option 1

-Option 1.1

-Option 1.2

-Option 1.3

How about adding a child with Option 1.1? Just add a new line under it and another single space.

Option 1

-Option 1.1

--Option 1.1.a

--Option 1.1.b

-Option 1.2

-Option 1.3

***Hyphen (-) above means space - just to illustrate the spaces. 

***We suggest setting up the list and nestings using your text editor such as Notepad or code editor such as Sublime, so you will see the indentations/spaces.


If you want to add an empty value before the options, add a dot (.) before the list.

If you want to require a dropdown, add an asterisk (*) before its name. 


A few more things to note when using the Dynamic Dropdown widget:

1. There is a 65k character limit for the Values box. If you add more than this, the texts will be cut off automatically. If you need to add more, add another Dynamic Dropdown widget. 

2. The longer list you add, the more it will become slow. Please try to optimize your lists. 

3. You can customize the style of the dynamic dropdown with custom CSS Codes on the Classic Form layout. However, you cannot do it on the Card Form layout. 


That's for the Dynamic Dropdown widget. If you have any questions, suggestions, or if you need help setting up, please let us know in the comments box below.  You can also reach us at our support forum

Contact Support:
Our customer support team is available 24/7 and our average response time is between one to two hours.
Our team can be contacted via:
Contact JotForm Support: https://www.jotform.com/contact/

Send Comment

2 Comments...

  • SafetyManager

    How can I conditionally disable the Dynamic Dropdown widget? The normal disabling function does not work on the DD.

    Thanks

  • rfreeman1966

    Can I update this widget with conditional logic?