cascading dropdown?

  • Luke
    Asked on May 23, 2017 at 3:11 AM

    Hi

    Is it possible to add cascading dropdown?

    i.e.

    Dropdown list for "department" with options to select Finance, IT, Retail etc.

    If Finance is selected, another dropdown for Sub department either appears or populates with options relevant to finance... i.e. Payroll, Accounts Team.

    If IT is selected the same dropdown has options such as Support, Project etc.

     

    Thanks

    Luke

     

  • cem JotForm Developer
    Replied on May 23, 2017 at 3:34 AM

    Hey Luke,

    You can use "Dynamic Dropdown" widget for this purpose.

    Firstly, if you have not add any widget to your forms, you can follow this guide to learn how to add a one:

    https://www.jotform.com/help/252-How-to-Add-a-Widget-to-your-Form

     

    Afterwards, you can find this widget by using search field in widgets section

    cascading dropdown? Image 1 Screenshot 30

    After adding a dynamic dropdown to your form, please edit the values field by following the notes below it to successfully create your cascade dropdown.

    cascading dropdown? Image 2 Screenshot 41

     

    If you need to ask any question please feel free to ask it.

    Thank you for writing us.

    Have a nice day!

  • CathKidstonIT
    Replied on May 23, 2017 at 4:50 AM

    Thanks very much for your reply.

    I have managed to add the dynamic dropdown with your help no problem!

    Im wondering.... is it possible to have the dynamic top downs next to each other, rather than appearing one on top of each other?

  • liyam
    Replied on May 23, 2017 at 6:37 AM

    Hello,

    Yes, you can. By default, fields expand its width to the actual size of the form. By shrinking it, it will it will only be on a limited size up to the extent of the field, and by then that you can put your fields to sit next to each other, containing what can fit on the width of the form.

    Please check this guide for information on how to make this happen: https://www.jotform.com/help/90-Form-Field-Positioning 

  • liyam
    Replied on May 23, 2017 at 6:52 AM

    Sorry, I spoke too early and of a different method. 

    Yes, you can set your fields on the widget to sit next to each other still. To do this, you need to insert this CSS code into your widget:

    select {
       float: left !important;
       clear: none !important;
    }

    On how to insert the code, you need to click on the Widget Settings Wizard > Custom CSS then insert the code.

    cascading dropdown? Image 1 Screenshot 20

    Don't forget to click the Update widget button at the bottom after inserting the code.

    If you have questions, please let us know.

    Thanks.