accessing headerItem in itemdatabound event

Question

User-153404742 posted

Hi,

I'm having trouble checking/unchecking a header checkbox when any of the row checkboxlist items are unchecked.  I tried with javascript but not able to see how to work that with checkboxList control.  So i have the following:

function CheckAllHeader(id) {
var masterTable = $find("<%= grdMain.ClientID %>").get_masterTableView();
var row = masterTable.get_dataItems();
if (id.checked == true) {
for (var i = 0; i < row.length; i++) {
masterTable.get_dataItems()[i].findElement("cboxSelectHeader").checked = true; // for checking the checkboxes

}
}
else {
for (var i = 0; i < row.length; i++) {
masterTable.get_dataItems()[i].findElement("cboxSelectHeader").checked = false; // for unchecking the checkboxes
}
}
}
function unCheckHeader(id) {
var masterTable = $find("<%= grdMain.ClientID %>").get_masterTableView();
var row = masterTable.get_dataItems();
if (id.checked == false) {
var checkBox = document.getElementById(hidden.value);
checkBox.checked = false;
}
}

this works if cboSelectHeader is checkbox...but I need to have checkboxList instead of checkbox....which are dynamically created at runtime.  So I just worked without javascript and have everything working; however, I don't know how to have the headerItem checkbox unchecked if any of the checkboxes get unchecked for any of the grid rows.

<HeaderTemplate>
<asp:CheckBox ID="checkAllHeader" runat="server" AutoPostBack="true" OnCheckedChanged="checkAllHeader_CheckedChanged"/>

</HeaderTemplate>
 <ItemTemplate>
<asp:CheckBoxList ID="chkItem" runat="server" OnSelectedIndexChanged="chkItem_SelectedIndexChanged" ></asp:CheckBoxList>
</ItemTemplate>

so on the checkAllHeader_CheckChanged event, I'm able to check/uncheck the checkboxlist items by looping through items in the grid control.  How do check/uncheck the headerTemplate checkbox item when the chkItem_SelectedIndexChnaged event fires?

Answer 1

User288213138 posted

Hi inkaln,

If you want to check/uncheck the checkbox in checkboxlist selectedIndexChnaged event, you can get the CheckBox control by using the findcontrol method, then do a check/ucheck based on your requirements.

Here's a demo you can use as a reference.

The code:

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="CustomerId" DataSourceID="SqlDataSource1">
                <Columns>
                    <asp:TemplateField>
                        <HeaderTemplate>
                            <asp:CheckBox ID="checkAllHeader" runat="server" AutoPostBack="true" OnCheckedChanged="checkAllHeader_CheckedChanged"/>
                        </HeaderTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField>
                        <ItemTemplate>
                            <asp:CheckBoxList ID="chkItem" runat="server" OnSelectedIndexChanged="chkItem_SelectedIndexChanged" AutoPostBack="true" DataSourceID="SqlDataSource1" DataTextField="Name" DataValueField="Name" ></asp:CheckBoxList>
                            <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:CaseTestConnectionString %>" SelectCommand="SELECT [Name], [Value] FROM [Fruit]"></asp:SqlDataSource>
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:BoundField DataField="CustomerId" HeaderText="CustomerId" ReadOnly="True" SortExpression="CustomerId" />
                    <asp:BoundField DataField="Name" HeaderText="Name" SortExpression="Name" />
                    <asp:BoundField DataField="Country" HeaderText="Country" SortExpression="Country" />
                </Columns>
                
            </asp:GridView>

protected void chkItem_SelectedIndexChanged(object sender, EventArgs e)
        {
            string value = null;
            foreach (GridViewRow row in GridView1.Rows)
            {
                if (row.RowType == DataControlRowType.DataRow)
                {
                    CheckBoxList cbl = row.FindControl("chkItem") as CheckBoxList;
                    CheckBox cb = GridView1.HeaderRow.FindControl("checkAllHeader") as CheckBox;
                 
                    foreach (ListItem li in cbl.Items)
                    {
                        if (li.Selected == true)
                        {
                            value = li.Value;
                            if (value == "Mango")
                            {
                                cb.Checked = true;
                            }
                            else if (value == "Apple")
                            {
                                cb.Checked = false;
                            }
                        }                                          
                    }
                }
            }            
        }

The result:

Best regards,

Sam

Answer 2

User-153404742 posted

I'm unable to make this work for telerik radGrid as I'm not using the regular grid control from .net.  Not sure but I don't see an option to loop through the GridViewRow inside the event ....any ideas on how to do this with telerik radgrid?..

Answer 3

User288213138 posted

Hi inkaln,

About telerik radGridView problem, I suggest you post the question to Telerik Developer Forums

Best regards,

Sam