Dropdown fields are easy to use because of the simplicity of picking an option from a list. If you need to create a dropdown with nested options or limit the choices that can be selected depending on the form filler’s selection, you can use the Dynamic Dropdowns widget.
To set up a Dynamic Dropdowns widget
- In the Form Builder, select Add Form Element in the upper-left corner.
- In the left pane, go to Widgets at the top.
- Search and select Dynamic Dropdowns to add it to your form.
- Next, select the widget’s wand icon to open settings.
- In the settings pane on the right, set up your dropdown options in the Values field.
Nesting or indenting the options with spaces creates a parent-child relationship between dropdown lists.
Here’s an example:
Vertebrates
Warm-blooded
Dog
Cat
Bird
.
Cold-blooded
Goldfish
Turtle
Frog
.
.
Invertebrates
With legs
Beetle
Ladybug
Spider
.
Without legs
Earthworm
Leech
.
.
.To break that down, the top-level options are
Vertebrates
Invertebrates
.To create choices for “Vertebrates,” add a new line under it and list the options, each with one leading space.
Vertebrates
Warm-blooded
Cold-blooded
.
Invertebrates
.To create choices for the 2nd-level “Warm-blooded” option, add a new line under it then list the choices, each with two leading spaces.
Vertebrates
Warm-blooded
Dog
Cat
Bird
.
Cold-blooded
.
Invertebrates
.And so on. See what it looks like in this demo form.
Notes
- Setting up the list and nestings using a text editor like Notepad is recommended.
- Include dot (.) as one of the choices in a set to initially display an empty “Please select” option for that set.
- Append asterisk (*) to a parent option to make its children required.
- The Values field has a 65000 character limit.
- The longer the list, the slower the widget becomes.
Send Comment:
13 Comments:
Hi, is there any way to add rows?
Just like configurable list did.
Hi, is there any way to pre-populate the fields on this widget?
Hi,
Is there a way to insert links in the dropdowns? Or can you hyperlink the text itself?
I have a form with dropdown widget https://www.jotform.com/build/220721649488060, however, it seems not following the style of the rest of the form (font size, field height, font color), could you advise what can be done, thanks.
I've now got the forms loading offline but still having issues with certain questions. The first Dynamic Dropdown I get too does not show the drop down boxes when offline... only
Can I populate or look up the choices in a drop-down using the contents of a table?
Hello JF,
I like the dynamic dropdown widget but it does not automatically suit the colour that the rest of the form has taken and stands out badly. How do I inject some css to change the colour and opacity of this box in order to make it fit in with the rest of the form?
Hi, is there any way to have "Please Select" displaying in the first drop down list of a Dynamic Dropdown. I have two drop downs but when I preview them they are pre-filled with the first selections. I would like to make the user select something from the first dynamic drop down list.
Thank you.
TEM COMO COLOCAR MULTI SELEÇÃO?
I have collected information in a google form that I would like to have referenced by a jotform before it can be submitted. How would I load a security question and response by a field such as name or ID to have the question 1 of 9 choices appear based on the field and only allow form submission based on a correct response, preloaded.
Thanks in advance for your support.
How do I change the size of a text box? it looks so small as default
How can I conditionally disable the Dynamic Dropdown widget? The normal disabling function does not work on the DD.
Thanks
Can I update this widget with conditional logic?