How to show multiple fields based on the picked value from a dropdown?

  • rogero
    Asked on August 8, 2016 at 7:21 AM

    Hi,

    I am doing a form for customers to submit "work orders" to me. I have a few different types of work that can be ordered and depending on the chosen work I need different information from the client. Is there a way to have a dynamic form that changes (hides and shows specific fields or maybe hiding and showing different tabs) based on the value that the client picks in a drop-down list?

    Roger

  • Nik_C
    Replied on August 8, 2016 at 7:44 AM

    You can do that by using conditions and Form Collapse field. To do that please follow:

    To do that please follow:

    1. Put Form collapse field right above the section that will be shown when you choose the first option from drop down, you can check this example in my form:

    How to show multiple fields based on the picked value from a dropdown? Image 1 Screenshot 50

    So I put form collapse before those text fields. Also, I set for each Form Collapse to be hidden on my form:

    How to show multiple fields based on the picked value from a dropdown? Image 2 Screenshot 61

    2. Then create conditions that will show each of the Form collapses based on a selection from the drop-down field:

    How to show multiple fields based on the picked value from a dropdown? Image 3 Screenshot 72

    With that setup, when your user, for example, clicks on Option 1, Form collapse will show and everything inside of form collapse will show as well.

    That way you can show different parts of your form based on user selection from a drop-down.

    Here is my example form that you can check or clone: https://form.jotform.com/62202513615949

    Also, you can see that I put one more Form collapse right above the Submit button, also hidden but with open state, so it will always show Submit button on your form:

    How to show multiple fields based on the picked value from a dropdown? Image 4 Screenshot 83

    Hope it helps. 

    If you need any additional assistance, please let us know.

    Thank you!

  • rogero
    Replied on August 8, 2016 at 9:06 AM

    Excellent, got it working.

    Thanks for good service

    Roger

  • beril JotForm UI Developer
    Replied on August 8, 2016 at 9:38 AM

    Hi Roger,

    On behalf of my colleague, you're most welcome. Feel free to contact us anytime. We will be glad to assist you.