Headers within a form

  • Adath
    Asked on October 22, 2015 at 12:57 PM

    When I build a list, is it possible to have certain elements in the list be, bold, larger font or italic. I tried inserting some html (<b><i>) and some CSS (<div style=”color:red;”</div>, but there was no effectg. Also, is it possible to designate certain line elements as headers and not be selectable such as this: The lines in red will not be selectable.

     

    Building Funds

    Fund 1

    Fund 2

    Fund 3

     

    Education Funds

    Fund 4

    Fund 5

    Fund 6

  • David JotForm Support
    Replied on October 22, 2015 at 3:46 PM

    Hi,

    For a setup such as that, I would recommend have a single dropdown with the categories, then a conditionally shown dropdown for the options in each category.

    http://www.jotform.com/help/57-Smart-Forms-Using-Conditional-Logic

    Headers within a form Image 1 Screenshot 20

    That way, they can select the category first, then select the option from the next drop down.  This will also ensure they do not select the categories instead of the options. 

    Here is my test form so you can see how it would work:

    https://form.jotform.com/52945682371968

    You can clone it to your own account if you would like:

    http://www.jotform.com/help/42-How-to-Clone-an-Existing-Form-from-a-URL

    On a side note, if you add this code to your form:

    http://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes

    .form-input.jf-required {
        min-width: 60%;
    }

    Will give you form a bit more uniform look.

  • Adath
    Replied on October 23, 2015 at 1:00 PM

    THANK YOU! That's amazing. I need to add in more categories - which I now have under: Funds by Catagory - but writing them in didn't populate new boxes. Could you tell me what I did wrong.

     

    THANKS

  • David JotForm Support
    Replied on October 23, 2015 at 2:15 PM

    Since you changed the options from category -1, category 0 etc to the new list, you would need to create new conditions.  Due to those options no longer being available, the conditions cannot be met.  This is what the new conditions would look like:

    Headers within a form Image 1 Screenshot 20

    And how the form would function:

    https://form.jotform.com/52955927894981

    If you make changes or add new fields, create new conditions for them and they should work properly.

  • Adath
    Replied on October 23, 2015 at 3:53 PM

    I'm so sorry! I thought I understood. But I had it all sent and all the boxes below were showing. So i thought if I deleted them they wouldn't show.

    But I think I screwed it up more.

     

    Could you help me again.

  • David JotForm Support
    Replied on October 23, 2015 at 5:05 PM

    You can revert your form back using your revision history:

    http://www.jotform.com/help/294-How-to-View-Form-Revision-History

    What you need to do is create 1 dropdown for each list you want to show.  Then, you would create a condition that says:

    if FUNDS BY CATEGORY Is Equal to "Whatever fund" SHOW "Whatever Fund dropdown"

    This will hide the field until someone selects "Whatever fund" from the FUNDS BY CATERGORY field.

    We also have a widget that may be easier to set up:

    http://widgets.jotform.com/widget/dynamic_dropdowns

    That will give the ability to create nested dropdowns.