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

Persisting the selected rows client-side on sorting/paging/filtering/grouping

1 Answer 158 Views

Grid

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

HSLaw asked on 13 Jan 2010, 05:43 AM

Hi,

Im trying out the sample at http://www.telerik.com/help/aspnet-ajax/grid-persist-selected-rows-client-sorting-paging-grouping-filtering.html
Here is my page: http://www.ximnet.com.my/aspnet35/test_grid.aspx.

However, the page doesn't maintain the selected row after page change or after sorting.
Is there something wrong with my code?

ASPX:

    
            <%@ Page Language="VB" AutoEventWireup="false" CodeFile="test_grid.aspx.vb" Inherits="test_grid" %> 
        
            <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> 
        
            <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
        
            <html xmlns="http://www.w3.org/1999/xhtml"> 
        
            <head runat="server"> 
        
                <title></title> 
        
                <script type="text/javascript"> 
        
                    var selected = {}; 
        
                    function RadGrid1_RowSelected(sender, args) { 
        
                        var gID = args.getDataKeyValue("gID"); 
        
                        if (!selected[gID]) { 
        
                            selected[gID] = true; 
        
                        } 
        
                    } 
        
                    function RadGrid1_RowDeselected(sender, args) { 
        
                        var gID = args.getDataKeyValue("gID"); 
        
                        if (selected[gID]) { 
        
                            selected[gID] = null; 
        
                        } 
        
                    } 
        
                    function RadGrid1_RowCreated(sender, args) { 
        
                        var gID = args.getDataKeyValue("gID"); 
        
                        if (selected[gID]) { 
        
                            args.get_gridDataItem().set_selected(true); 
        
                        } 
        
                    } 
        
                    function GridCreated(sender, eventArgs) { 
        
                        var masterTable = sender.get_masterTableView(); 
        
                        //check whether all items on the active page are selected 
        
                        if (masterTable.get_selectedItems().length == masterTable.get_pageSize()) { 
        
                            //find the checkbox in the header of the GridClientSelectColumn and set checked state for it - will work with AllowMultiRowSelection = true only! 
        
                            var gridHeader = masterTable.get_element().getElementsByTagName("TH")[0]; 
        
                            for (var i = 0; i < gridHeader.childNodes.length; i++) { 
        
                                if (gridHeader.childNodes[i].id.indexOf("columnSelectCheckBox") > -1) { 
        
                                    gridHeader.childNodes[i].checked = "true"; 
        
                                } 
        
                            } 
        
                        } 
        
                    } 
        
                </script> 
        
            </head> 
        
            <body> 
        
                <form id="form1" runat="server"> 
        
                <telerik:radscriptmanager id="RSM" runat="server" /> 
        
                <div> 
        
                    <telerik:radgrid runat="server" id="gPoint" allowmultirowselection="True" showfooter="true" 
        
                        runat="server" allowpaging="True" allowsorting="True" skin="Default" horizontalalign="NotSet" 
        
                        width="100%" cellpadding="5"> 
        
                                            <pagerstyle position="Top" mode="NextPrevAndNumeric" /> 
        
                                             <ClientSettings> 
        
               <Selecting AllowRowSelect="True" /> 
        
                  <ClientEvents OnRowCreated="RadGrid1_RowCreated" OnRowSelected="RadGrid1_RowSelected" 
        
                               OnRowDeselected="RadGrid1_RowDeselected" OnGridCreated="GridCreated" /> 
        
             </ClientSettings> 
        
                                            <mastertableview autogeneratecolumns="False" gridlines="None" ClientDataKeyNames="gID"><NoRecordsTemplate> 
        
            <div style="text-align:left; vertical-align:middle;">No points found</div> 
        
            </NoRecordsTemplate> 
        
            <Columns> 
        
                <telerik:GridClientSelectColumn UniqueName="ClientSelectColumn" /> 
        
            <telerik:GridTemplateColumn UniqueName="gID" SortExpression="gID" HeaderText="Serial"> 
        
            <ItemTemplate> 
        
            <%#DataBinder.Eval(Container, "DataItem.gID")%> 
        
            </ItemTemplate> 
        
            </telerik:GridTemplateColumn> 
        
            </Columns> 
        
            </mastertableview> 
        
            </telerik:radgrid> 
        
                </div> 
        
                </form> 
        
            </body> 
        
            </html>

VB:

    
            Imports System.Data 
        
            Partial Class test_grid 
        
                Inherits System.Web.UI.Page 
        
                Protected Sub gPoint_NeedDataSource(ByVal source As Object, ByVal e As Telerik.Web.UI.GridNeedDataSourceEventArgs) Handles gPoint.NeedDataSource 
        
                    Dim dt As DataTable = New DataTable 
        
                    Dim dc As DataColumn = New DataColumn 
        
                    dc.ColumnName = "gID" 
        
                    dt.Columns.Add(dc) 
        
                    Dim dr As DataRow 
        
                    Dim i As Integer 
        
                    While i <> 50 
        
                        dr = dt.NewRow 
        
                        dr("gID") = System.Guid.NewGuid.ToString 
        
                        dt.Rows.Add(dr) 
        
                        i = i + 1 
        
                    End While 
        
                    gPoint.DataSource = dt 
        
                End Sub 
        
            End Class

Product Bundles

DevCraft

Web

Mobile

Document Management

Desktop

Reporting & Mocking

Automated Testing

CMS

UI/UX Tools

Debugging

Free Tools

Support and Learning

Productivity and Design Tools

Persisting the selected rows client-side on sorting/paging/filtering/grouping

1 Answer, 1 is accepted