How do I make a sub list for checklist?

Hwo do I make a sub list for checklist? HOW>>>???

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.

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????

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;
}

soooo perfect!! thanks to you!