Reselect row of grid after rebind

[hasan]

Hello
How can i select row (after rebind grid)  that seleted befor rebind.
The multi page of grid is true

[Shinu]

Hi Hasan,

Go through the following help articles which explains how to persist selected rows on Paging/Sorting/Filtering etc.
Persisting the selected rows client-side on sorting/paging/filtering/grouping
Persisting the selected rows server-side on sorting/paging/filtering/grouping

Thanks
Shinu

[Marty]

Hi,

I'm trying to use the method in the help doc referenced above, on the client side, to persist selected rows of one of my grids after a sort/filter/grouping... however, it's not quite working right for me and I'm wondering if it's something I'm doing wrong.

There are tons of forum posts about doing this, but nobody has posted about having issues after being using the referenced helpdoc.
I'm using Q32008 ver of the controls, ASP.NET 3.5, VS2008, Vista, IE7.

What happens is that rows are selected and deselected properly, as they should be, however, when you then do a sort/filter/grouping, the grid just loads with ALL items selected.  Unfortunately I'm having some issues finding a javascript debugger, so figured I'd post here to see if you guys had an idea.  The grid is embedded inside of a table inside of a RadPanelBar and is heirarchichal.  I tried using the same code on a grid that is non-heirarchichal, and not in a RadPanelBar with results that were the same.

Here is the code for my grid:

<telerik:RadGrid OnDetailTableDataBind="GrdSysApps_DetailTableDataBind" ID="GrdSysApps"
    runat="server" OnNeedDataSource="GrdSysApps_OnNeedDataSource" AllowMultiRowSelection="True"
    ClientSettings-Scrolling-AllowScroll="true" AutoGenerateColumns="False" Width="99%"
    ClientSettings-Scrolling-ScrollHeight="150" GridLines="None" ShowGroupPanel="true"
    ClientSettings-Scrolling-SaveScrollPosition="true" ClientSettings-Scrolling-UseStaticHeaders="true"
    AllowFilteringByColumn="true" AllowSorting="true">
    <MasterTableView DataKeyNames="SystemApplicationID">
        <RowIndicatorColumn>
            <HeaderStyle Width="20px"></HeaderStyle>
        </RowIndicatorColumn>
        <ExpandCollapseColumn>
            <HeaderStyle Width="20px"></HeaderStyle>
        </ExpandCollapseColumn>
        <Columns>
            <telerik:GridBoundColumn DataField="SystemApplicationID" EmptyDataText="&amp;nbsp;"
                UniqueName="column" Visible="False">
            </telerik:GridBoundColumn>
            <telerik:GridClientSelectColumn UniqueName="ClientSelectColumn">
                <HeaderStyle Width="20px"></HeaderStyle>
                <FilterTemplate>
                    <asp:DropDownList ID="DropDownList1" AutoPostBack="true" runat="server" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged">
                        <asp:ListItem Text="Selected"></asp:ListItem>
                        <asp:ListItem Text="Not Selected"></asp:ListItem>
                        <asp:ListItem Text="All"></asp:ListItem>
                    </asp:DropDownList>
                </FilterTemplate>
            </telerik:GridClientSelectColumn>
            <telerik:GridBoundColumn DataField="Name" EmptyDataText="&amp;nbsp;" HeaderText="Name"
                UniqueName="column2">
            </telerik:GridBoundColumn>
            <telerik:GridBoundColumn DataField="Description" EmptyDataText="&amp;nbsp;" HeaderText="Description"
                UniqueName="column3">
            </telerik:GridBoundColumn>
            <telerik:GridBoundColumn DataField="ManagerDel" EmptyDataText="&amp;nbsp;" HeaderText="Mgr Approver"
                UniqueName="column5">
            </telerik:GridBoundColumn>
            <telerik:GridBoundColumn DataField="DirectorDel" EmptyDataText="&amp;nbsp;" HeaderText="Dir Approver"
                UniqueName="column9">
            </telerik:GridBoundColumn>
            <telerik:GridBoundColumn DataField="Director2Del" EmptyDataText="&amp;nbsp;" HeaderText="Dir2 Approver"
                UniqueName="column6">
            </telerik:GridBoundColumn>
        </Columns>
        <DetailTables>
            <telerik:GridTableView DataKeyNames="SystemApplicationID" HierarchyLoadMode="ServerOnDemand"
                AllowSorting="false" AllowFilteringByColumn="false" Name="OriginalOwners">
                <ParentTableRelation>
                    <telerik:GridRelationFields MasterKeyField="SystemApplicationID" DetailKeyField="SystemApplicationID" />
                </ParentTableRelation>
                <Columns>
                    <telerik:GridBoundColumn HeaderText="Default System Manager" HeaderButtonType="TextButton"
                        DataField="Manager">
                    </telerik:GridBoundColumn>
                    <telerik:GridBoundColumn HeaderText="Default System Director" HeaderButtonType="TextButton"
                        DataField="Director">
                    </telerik:GridBoundColumn>
                    <telerik:GridBoundColumn HeaderText="Default System 2nd Director" HeaderButtonType="TextButton"
                        DataField="Director2">
                    </telerik:GridBoundColumn>
                </Columns>
            </telerik:GridTableView>
        </DetailTables>
    </MasterTableView>
    <ClientSettings AllowDragToGroup="true">
        <Selecting AllowRowSelect="True" />
        <ClientEvents OnRowCreated="GrdSysApps_RowCreated" OnRowSelected="GrdSysApps_RowSelected"
            OnRowDeselected="GrdSysApps_RowDeselected" />
    </ClientSettings>
    <FilterMenu EnableTheming="True">
        <CollapseAnimation Type="OutQuint" Duration="200"></CollapseAnimation>
    </FilterMenu>
</telerik:RadGrid>

The javascript, identical to what is in helpdoc, except for variable/datakey names:

var selected = {};
function GrdSysApps_RowSelected(sender, args) {
    var sysAppID = args.getDataKeyValue("SystemApplicationID");
    if (!selected[sysAppID]) {
        selected[sysAppID] = true;
    }
}
function GrdSysApps_RowDeselected(sender, args) {
    var sysAppID = args.getDataKeyValue("SystemApplicationID");
    if (selected[sysAppID]) {
        selected[sysAppID] = null;
    }
}
function GrdSysApps_RowCreated(sender, args) {
    var sysAppID = args.getDataKeyValue("SystemApplicationID");
    if (selected[sysAppID]) {
        args.get_gridDataItem().set_selected(true);
    }
}

Any help/input/guidance would be appreciated, from anybody.

Thanks in advance,
Marty

[Marty]

Also - forgot to add that I have the JavaScript in an externally referenced .js file.  But the same behavior occurs if I put the JS inline on the apsx page or in the external file.

[Marty]

For anybody curious, the reason this wasn't working for me was because I hadn't set the "ClientDataKeyNames" attribute of the MaterTableView.  Once I did this, it the code works great.

Now, for anybody interested, I'm using server-side data binding on this grid.  In my application, the grid is sometimes loaded with some rows already selected, which means, using this method of retaining selected rows on the client side doesn't work 100%. 

So, to work around this, while still allowing client-side selection, I wrote a handler for the client-side OnCommand event as follows:

function RaiseCommand(sender, args) {
    var commandName = args.get_commandName();

    if (commandName == "Sort" || commandName == "Filter" || commandName == "GroupByColumn" || commandName == "UnGroupByExpression") {

        var panelBar = $find("<%= RadPanelBar1.ClientID %>");
        var panelItem = panelBar.findItemByText("Change Summary");
        var grdSysApps = panelItem.findControl("GrdSysApps");
        var masterTableView = grdSysApps.get_masterTableView();
       var selectedRows = masterTableView.get_selectedItems();
        var count = selectedRows.length;
        for (var i = 0; i < count; i++) {
            var sysAppID = selectedRows[i].getDataKeyValue("SystemApplicationID");
            if (!selected[sysAppID]) {
                selected[sysAppID] = true;
            }
        }
    }
}

This is fired prior to the filter, sort, group, or ungroup commands and makes sure that the items that may not have been selected client-side (like the ones that are selected in my code server-side) are part of the client-side array 'selected[]'... to work in conjunction with the other 3 methods provided in the help doc.  Hope this helps/makes sense.

Happy coding.