After populating the repeater control, my checkbox display is like this:
I have a couple of questions regarding this setup:
If I check the box for Group 1, I want all the items under Group 1 to be automatically selected. How can I achieve this functionality?
Additionally, I have a "Select All" button that should select all the items across all groups. Since the checkboxes are within the repeater control, I'm unsure about how to implement this feature.
Group 1
Item 1
Item 2
Group 2
Item 3
Item 4
Group 3
Item 5
Item 6
ASPX :
<ol>
<asp:Repeater ID="rp_Groups" runat="server" OnItemDataBound="rp_Groups_ItemDataBound">
<ItemTemplate>
<ul>
<asp:CheckBox RepeatColumns="2" runat="server" ID="chk_Group" Text='<%# Eval("category_type") %>' Value='<%# Eval("service_type_category_id") %>' onclick="OnGroupClick" />
<asp:CheckBoxList runat="server" ID="chkServiceType" style="padding-left:20px" DataValueField="ServiceTypeID" DataTextField="Name" EnableViewState="true"
></asp:CheckBoxList>
<br />
</ul>
</ItemTemplate>
</asp:Repeater>
</ol>
<script type="text/javascript">
function OnGroupClick(group) {
for(item in group.getElementsByTagName('input')) {
item.checked = group.checked;
}
}
function selectAll() {
$("#<%=chkServiceType.ClientID %> input[type=checkbox]").each(function () {
this.checked = true;
})
}
</script>