Please have a look at the fiddle here.
What I'd like to do is show the checkboxes in the group on page load if any checkbox in the group is prechecked.
here is the HTML:
<ul>
<li class="header">
<h3>Group 1</h3>
</li>
<li class="option">
<label><input type="checkbox" /> Value</label>
</li>
<li class="option">
<label><input type="checkbox" checked="checked" /> Value</label>
</li>
<li class="option">
<label><input type="checkbox" /> Value</label>
</li>
<li class="header">
<h3>Group 2</h3>
</li>
<li class="option">
<label><input type="checkbox" /> Value</label>
</li>
<li class="option">
<label><input type="checkbox" /> Value</label>
</li>
<li class="option">
<label><input type="checkbox" /> Value</label>
</li>
<li class="header">
<h3>Group 3</h3>
</li>
<li class="option">
<label><input type="checkbox" /> Value</label>
</li>
<li class="option">
<label><input type="checkbox" /> Value</label>
</li>
<li class="option">
<label><input type="checkbox" /> Value</label>
</li>
</ul>
The main obstacle for me is I can't wrap the group (like in a <div>
or an <li>
) because the headers are inserted dynamically. It would be great to show/hide the wrap, but that's not an option. I can't figure out how to target the checkboxes in the group if I can't wrap it. Your ideas are greatly appreciated.
Aucun commentaire:
Enregistrer un commentaire