What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    How do I make a sub list for checklist?

    Asked by BBC2016 on May 31, 2016 at 04:30 AM
    Hwo do I make a sub list for checklist? HOW>>>???
  • Profile Image
    JotForm Support

    Answered by beril on May 31, 2016 at 05:06 AM

    Hello again;

    Currently, it is not possible to create sub options for checkbox field. However, we can show sub options by injecting CSS code and by the help of conditions.

    First of all, we need to add our sub-options as you see below:

    Then, you can inject the CSS code below:

    span.form-checkbox-item {

        width : 100%;

        position : relative!important;

        margin-left : -100px !important;

    }

    div.form-single-column {

        width : 100%;

    }

    input.form-checkbox {

        float : right;

      

    }

    #input_32_1 , #input_32_2, #input_32_4 {

        display : block !important;

        width : 450px !important;

    }

    And finally, you can show/hide your sub-options with conditions.

    https://www.jotform.com/help/196-Hide-or-Show-Multiple-Fields-at-Once

    If you have any question or issues, please do not hesitate to contact us. We will be glad to assist you.

  • Profile Image

    Answered by BBC2016 on June 01, 2016 at 12:56 PM

    it looks like a gigantic mess when i add in your codes....what happen> the checkboxes are scattered through the page. Please clone and show me??? please????

  • Profile Image
    JotForm Support

    Answered by liyam on June 01, 2016 at 01:54 PM

    Hello BBC2016,

    To make this work out better, can you provide us a list which ones are to be indented (sub) and which ones are to be parent items?  This way we can provide a better solution on your form for which you can simply just copy right after.

    We'll be looking forward to your response.

     

    Edit: Here's my code for this one. If you would like to indent the 2nd checkbox, you can try this code

    #cid_32 .form-single-column span:nth-child(2) {
    margin-left: 20px;
    }

    Simply add a new CSS code and just replace that number after the nth-child with the element in the list you wanted to be indented.

    Example: This code will indent the 2nd and 3rd element

    #cid_32 .form-single-column span:nth-child(2) {
    margin-left: 20px;
    }
    #cid_32 .form-single-column span:nth-child(3) {
    margin-left: 20px;
    }

  • Profile Image

    Answered by BBC2016 on June 02, 2016 at 01:44 AM

    soooo perfect!! thanks to you!