How to have dynamic drop down based on selection?

hi Team,

    I need some help on dynamic drop down menu with calculation values for email to send.

   for ex.

     dropdown 1 had below value

        vegetables

        fruits

        Dry fruits

Now based on my dropdown values, I need to show values for each options.

   for ex.

for dropdown 1 Vegetables selection

                        potato

                        onion

for dropdown 2 fruits selection

                        apple

                        orange

for dropdown 3 dry fruits selection

                        Almond

                        Cashew

do not want to use show and hide based on dropdown 1 selection please as I need 10 line and do not want to create 30 drop boxes to show and hide based on selection, it slows down form randomization I have tried it. 

In that case, maybe a Dynamic dropdown widget would work for you:

Where you can set options by nesting them:

And here is how it works:

Here is my test form: https://form.jotform.com/73301852951960 please check.

Hope it helps.

Thank you!

hi is it possible to have multiple drop down for 2nd drop down.

for ex. if I select vegetable. I get 3 drop down instead 1 to select.

Unfortunately, that is not possible. However, you can nest additional sub-options to the second dropdown that will create additional dropdown field.  

https://form.jotform.com/73581427431961 

can I do dynamic selection on Vegetales.

for ex.

form https://www.jotform.com/build/80067917185160

if I select text1 can I have group A selection and on text2 , group B gets selected. do we have any property which I can set ?

Since you're using regular drop-down field and widget, that is not possible to do with that setup, like in your test form.

The workaround would be to break the widget in two:

And then show them conditionally based on the text selection:

You can check how it works here: https://form.jotform.com/80071499751967

Let us know how that worked for you.

Thank you!

can we use  CSS to select value in drop down 1 and show / hide  values in drop down 2.

You cannot use CSS to select a value in a drop-down and you cannot use CSS to show/hide options in a dropdown based on the selected option of the first drop-down because you don't know which option was selected.

Let us know if you have further questions.

we can keep default values if need to.

CSS cannot be used in that way, even if you set the default value since CSS is used for styling the element(s) what you want to do has to be done with JavaScript.

However, in your case, since you want to use widgets dropdowns, I would say that the best solution would be to use regular dropdowns and conditional logic to show/hide them properly.

Let us know if that could work.

Thank you!