check/uncheck checkboxes in a radgrid

[Kranthi]

Hi All 

i need a solution for check/uncheck checkbox in a radgrid column

this is my piece of code

            <telerik:RadGrid ID="M" runat="server" Width="99%" AllowPaging="True" EnableViewState="False"
                GridLines="None" meta:resourcekey="MResource1" AllowFilteringByColumn="true"
                OnInit="GridControl_Init" EnableLinqExpressions="false" 
                EnableEmbeddedSkins="false" AutoGenerateColumns="False">
                <HeaderContextMenu EnableEmbeddedSkins="True">
                </HeaderContextMenu>
                <FilterMenu Skin="Nediso" EnableEmbeddedSkins="false">
                </FilterMenu>
                <PagerStyle Mode="NextPrevAndNumeric" Position="TopAndBottom" AlwaysVisible="true" />
                <MasterTableView Width="100%" EnableViewState="False" AllowFilteringByColumn="true">
                
                <RowIndicatorColumn>
                        <HeaderStyle Width="20px" />
                    </RowIndicatorColumn>
                <Columns>  
                     <telerik:GridTemplateColumn  AllowFiltering="false" AutoPostBackOnFilter="false" HeaderStyle-Width="5%" ItemStyle-Width="5%" >
                    <HeaderStyle Width="3%" HorizontalAlign="Justify" />
                    <ItemStyle Width="3%" HorizontalAlign="Justify" />
                    <HeaderTemplate>
                    <input type="checkbox" runat="server" value="check" ID="checkbox"  />
                    </HeaderTemplate>
                    <ItemTemplate>
                    <asp:CheckBox runat="server" AutoPostBack="false" Width="5%" ID="checkbox2" />
                    </ItemTemplate>
                    </telerik:GridTemplateColumn>




                     <telerik:GridBoundColumn DataField="TOKEN" Visible="false" UniqueName="TOKEN" >
                    </telerik:GridBoundColumn>
                    <telerik:GridBoundColumn DataField="FIRST NAME" HeaderText="FIRST NAME" UniqueName="FIRST NAME">
                    </telerik:GridBoundColumn>
                    <telerik:GridBoundColumn DataField="LAST NAME" HeaderText="LAST NAME" UniqueName="LAST NAME">
                    </telerik:GridBoundColumn>
                    <telerik:GridBoundColumn DataField="STATUS" HeaderText="STATUS" UniqueName="STATUS">
                    </telerik:GridBoundColumn>
                    <telerik:GridBoundColumn DataField="DESIGNATION" HeaderText="DESIGNATION" UniqueName="DESIGNATION">
                    </telerik:GridBoundColumn>
                    </Columns>
                    <PagerStyle AlwaysVisible="true" Mode="NextPrevAndNumeric" Position="TopAndBottom" />
                    
                </MasterTableView>
                <ClientSettings AllowColumnsReorder="True" ReorderColumnsOnClient="True" EnableRowHoverStyle="True">
                    <Resizing AllowColumnResize="True" />
                    <Selecting AllowRowSelect="True" />                    
                    <ClientEvents OnFilterMenuShowing="OnFilterMenuShowing"></ClientEvents> 
                    </ClientSettings>
                <FilterMenu EnableTheming="True">
                    <CollapseAnimation Type="None" />
                    <ExpandAnimation Type="None" />
                </FilterMenu>
            </telerik:RadGrid>

please give me a solution for this, i am using ajax update panel for radgrid which is one problem if we use autopostback feature for checkbox column.. i have used many javascript snippets for this but it's not working on client funtionality..

can anyone give me a client side or serverside solution for this event.

[Shinu]

Hi,

I suppose you want to make the checkboxes checked on clicking the checkbox in HeaderTemplate. Here is the sample code.
aspx:

<HeaderTemplate>
      <input type="checkbox" runat="server" value="check" ID="checkbox"  onclick="CheckAll(this);"  />
</HeaderTemplate>

JS:

function CheckAll(id)
{
 var masterTable = $find("<%= RadGrid1.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("checkbox2").checked = true;
  }
 }
 else
 {
   for (var i = 0; i < row.length; i++)
   {
     masterTable.get_dataItems()[i].findElement("checkbox2").checked = false;
   }
 }
}

Thanks,
Shinu.

[Murugesh]

Shinu,

Will it work on the paging? Other words, If I click check all, will it check  all the items on all the pages toher than current page.

Muru

[Shinu]

Hi Murugesh,

When the grid is in paging mode only the items for the current page are retrieved - there are no items in memory.
Additionally If you want to operate with all records from the source when the grid paging is enabled, reference directly the data from the underlying data source to process further operations over it.
The other solution is to disable temporary the paging feature of the control.
You have to set the AllowPaging property of the grid to false at a certain stage of the life-cycle and rebind the control invoking its Rebind() method, then traverse all items in it. When you are done with this task, set the AllowPaging property back to true and rebind the grid to enable the paging feature again.

Thanks,
Shinu

[Murugesh]

Shinu,

Thank you for your quick response.  I don't want to do the allow paging property as my data source has  more than 50,000 record. 

Is there any work around using CheckAll header control, server side event  to maintain the checkbox state?

I am not able to find any best solution. I have spent almost whole day. Could you please help on this?

Regards,
Muru

[Shinu]

Hi Murugesh,

Please have a look into the following Documentation and code library to get your required scenario:
Persisting CheckBox control state in GridTemplateColumn on rebind
RadGrid client side toggle selection with server side persisting of the selected items after Sorting, Filtering and Paging

Thanks,
Shinu

[Preeti]

http://demos.telerik.com/aspnet-ajax/grid/examples/data-editing/batch-editing/defaultcs.aspx


I
want to implement the grid check box which is used in above link but
there is a problem of datatype of that discontinued coloumn..please tell
me which data type is used when a boolean value is passed?

[Shinu]

Hi Preeti,

Can be more specific about your issue. Please provide code snippet if necessary. The GridCheckBoxColumn will accept only Boolean value as shown in the demo. Can you elaborate on your requirement.

ASPX:

<telerik:GridCheckBoxColumn DataField="Discontinued"
HeaderText="Discontinued" SortExpression="Discontinued" UniqueName="Discontinued">
</telerik:GridCheckBoxColumn>
. . .
 <asp:SqlDataSource ID="SqlDataSource1" runat="server". . .>
 <UpdateParameters>
   <asp:Parameter Name="Discontinued" Type="Boolean"></asp:Parameter>
 </UpdateParameters>
</asp:SqlDataSource>

Thanks,
Shinu.

[Tirtha]

hi every one I am facing a problem with telerik grid. I have a checkbox in it but it is returning false if checked. Please help me out. Here is the code below.

<telerik:RadGrid ID="RadGrid1" runat="server" AutoGenerateColumns="False"
                    GridLines="None">
                <MasterTableView>
                <Columns>
                <telerik:GridBoundColumn DataField="YouTubeId" HeaderText="YouTubeId" UniqueName="YouTubeId" Display="false"></telerik:GridBoundColumn>
                <telerik:GridBoundColumn DataField="Video" HeaderText="Video" UniqueName="Video"></telerik:GridBoundColumn>
                <telerik:GridBoundColumn DataField="Date" HeaderText="Submission Date" UniqueName="Date"></telerik:GridBoundColumn>
                <telerik:GridTemplateColumn HeaderText="Verify" UniqueName="">  
                            <ItemTemplate>
                            <asp:CheckBox ID="gvCB" runat="server"/>
                            </ItemTemplate>
                            </telerik:GridTemplateColumn>
                </Columns>
                </MasterTableView>
                </telerik:RadGrid>


protected void btnSubmit_Click(object sender, EventArgs e)
    {
        foreach (GridDataItem item in RadGrid1.MasterTableView.Items)
        {
            CheckBox chk = (CheckBox)item.FindControl("gvCB");
            if (chk.Checked == true)
            {
                dl.Inline_Process("Update Video set Status='True' where YouTubeId='" + item["YouTubeId"].Text + "'");
            }
        }
    }

[Eyup]

Hello Tirtha,

I've created a sample RadGrid web site to test the described behavior. On my side the state of the checkboxes is transmitted as expected. Please run the attached application and let me know about the result.

You can also check the built-in row selection functionality provided by RadGrid:
http://demos.telerik.com/aspnet-ajax/grid/examples/functionality/filtering/basic-filtering/defaultcs.aspx

Regards,
Eyup
Telerik