This is a migrated thread and some comments may be shown as answers.

Select All Items in asp.net CheckBoxList in RadGrid's FormTemplate

2 Answers 219 Views

Grid

This is a migrated thread and some comments may be shown as answers.

Nikola asked on 19 Dec 2011, 09:02 AM

Hi!

I need to add a CheckBox to select/deselect all items in a CheckBoxList. The CheckBoxList is in the RadGrid's FormTemplate. My code is like this:

<telerik:RadGrid ID="RadGrid1" runat="server" ... >

...

<MasterTableView ...>

...

<EditFormSettings EditFormType="Template">

<EditColumn UniqueName="EditCommandColumn1"></EditColumn>

<FormTemplate>

<table class="edit-table-rad" cellspacing="2" cellpadding="1" width="100%" border="0">

...

<tr>

<td align="left" width="200px">

<b>Languages:</b><br />

<asp:CheckBox ID="chbSelectAllLanguage" runat="server"

Text="Select All"

ClientIDMode="Static"/>

</td>

<td>

<asp:CheckBoxList ID="cblLanguage" runat="server"

DataSourceID="entityDataSourceLanguage"

DataTextField="LanguageName"

DataValueField="LanguageID"

RepeatColumns="4">

</asp:CheckBoxList>

</td>

</tr>

...

</table>

</FormTemplate>

</EditFormSettings>

</MasterTableView>

</telerik:RadGrid>

I tried to get the CheckBox with jQuery by ID or cssclass, but I think that the CheckBox in the RadGrid's FormTemplate is not in the DOM at document.ready time.

Is there a way to select/deselect all CheckBoxList items by selecting/deselecting the single CheckBox in the FormTemplate?

2 Answers, 1 is accepted

Accepted

answered on 19 Dec 2011, 02:35 PM

Hello Nikola,

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<title></title>

<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">

<script type="text/javascript">

function SelectDeselect(chk, chklst) {

// Do your logic here

}

</script>

</telerik:RadCodeBlock>

</head>

<body>

<form id="form1" runat="server">

<div>

<telerik:RadScriptManager ID="RadScriptManager1" runat="server">

</telerik:RadScriptManager>

<telerik:RadGrid ID="RadGrid1" runat="server" AutoGenerateColumns="false" OnNeedDataSource="RadGrid1_NeedDataSource"

OnItemDataBound="RadGrid1_ItemDataBound">

<MasterTableView>

<Columns>

<telerik:GridBoundColumn DataField="ID" HeaderText="ID" UniqueName="ID">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="Name" HeaderText="Name" UniqueName="Name">

</telerik:GridBoundColumn>

<telerik:GridEditCommandColumn>

</telerik:GridEditCommandColumn>

</Columns>

<EditFormSettings EditFormType="Template">

<EditColumn UniqueName="EditCommandColumn1">

</EditColumn>

<FormTemplate>

<div>

<asp:CheckBox ID="CheckBox1" runat="server" />

<br />

<asp:CheckBoxList ID="CheckBoxList1" runat="server">

<asp:ListItem Text="1" Value="1"></asp:ListItem>

</asp:CheckBoxList>

</div>

</FormTemplate>

</EditFormSettings>

</MasterTableView>

</telerik:RadGrid>

</div>

</form>

</body>

</html>

protected void RadGrid1_NeedDataSource(object sender, GridNeedDataSourceEventArgs e)

{

dynamic data = new[] {

new { ID = "1", Name ="Name1"},

new { ID = "2", Name ="Name2"},

new { ID = "3", Name ="Name3"},

new { ID = "4", Name ="Name4"}

};

RadGrid1.DataSource = data;

}

protected void RadGrid1_ItemDataBound(object sender, Telerik.Web.UI.GridItemEventArgs e)

{

if (e.Item is GridEditableItem && e.Item.IsInEditMode)

{

GridEditableItem item = e.Item as GridEditableItem;

CheckBox CheckBox1 = item.FindControl("CheckBox1") as CheckBox;

CheckBoxList CheckBoxList1 = item.FindControl("CheckBoxList1") as CheckBoxList;

CheckBox1.Attributes.Add("onclick", "javascript:SelectDeselect('" + CheckBox1 .ClientID +"','" + CheckBoxList1.ClientID + "')");

}

Thanks,
Jayesh Goyani