Retain expanded/selected state in hierarchy on rebind (3 Level)

6 posts, 0 answers
  1. Mae
    Mae avatar
    1 posts
    Member since:
    Jan 2014

    Posted 26 May 2014 Link to this post

    I've had a hierarchical grid w/binds on server mode and a checkbox nested inside the GridTemplateColumn found on the third level. The problem is I can't get to work the functionality such that when user selects a checkbox then scrolls to next page it should retain the expanded state. Currently, I have tried your sample code found on http://www.telerik.com/forums/how-to-maintain-expanded-rows-of-detailtable-after-postback but the problem is for every row selected on a particular page, it also expands the row from detail table on the other pages.

    Appreciate your immediate response and help on the matter.


    Below is the aspx code

    <td>
    <Telerik:RadScriptManager runat="server" ID="RadScriptManager1">
    </Telerik:RadScriptManager>
    <Telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server">
    <Telerik:RadGrid ID="RadGridPatientData" runat="server" AllowMultiRowSelection="true"
    CellSpacing="0" Width="945" Height="325" PagerStyle-AlwaysVisible="true" Visible="false"
    AllowPaging="True" OnDetailTableDataBind="RadGridPatientData_DetailTableDataBind"
    OnNeedDataSource="RadGridPatientData_NeedDataSource" OnItemDataBound="RadGridPatientData_ItemDataBound"
    OnItemCreated="RadGridPatientData_ItemCreated" OnPageIndexChanged="RadGridPatientData_PageIndexChanged"
    AutoGenerateColumns="true" HeaderStyle-HorizontalAlign="Left">
    <PagerStyle Mode="NextPrev" PagerTextFormat="{4} Page {0} of {1}, items {2} to {3} of {5}">
    </PagerStyle>
    <MasterTableView DataMember="Patient" Width="100%" ClientDataKeyNames="CheckSumId"
    DataKeyNames="CheckSumId" AllowMultiColumnSorting="True" AutoGenerateColumns="true"
    EnableNoRecordsTemplate="true" ShowHeadersWhenNoRecords="false">
    <DetailTables>
    <Telerik:GridTableView DataMember="Admission" ClientDataKeyNames="AdmissionId" DataKeyNames="AdmissionId"
    Width="100%" AllowPaging="false">
    <DetailTables>
    <Telerik:GridTableView DataMember="Document" ClientDataKeyNames="Id" DataKeyNames="Id"
    Width="99%" AllowPaging="false">
    <Columns>
    <Telerik:GridTemplateColumn HeaderText="">
    <ItemTemplate>
    <asp:CheckBox ID="chkSelectDoc" runat="server" AutoPostBack="true" OnCheckedChanged="chkSelectDoc_CheckChanged" />
    </ItemTemplate>
    </Telerik:GridTemplateColumn>
    </Columns>
    </Telerik:GridTableView>
    </DetailTables>
    </Telerik:GridTableView>
    </DetailTables>
    <NoRecordsTemplate>
    <table width="100%" border="0" cellpadding="0" cellspacing="0">
    <tr>
    <td align="center">
    <br />
    <p style="color: Black">
    No document(s) found...</p>
    </td>
    </tr>
    </table>
    </NoRecordsTemplate>
    </MasterTableView>
    <ClientSettings>
    <Scrolling AllowScroll="true" ScrollHeight="400px" UseStaticHeaders="true" />
    <Selecting AllowRowSelect="true" />
    <ClientEvents OnCommand="function(){}" />
    </ClientSettings>
    </Telerik:RadGrid>
    </Telerik:RadAjaxPanel>
    </td>
  2. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 27 May 2014 in reply to Mae Link to this post

    Hi Mae,

    You can set the RetainExpandStateOnRebind property of the grid, it gets or sets a value indicating if the Expanded property of both hierarchy and group items will be retained after a call to Rebind() or Rebind() method. Please take a look at the sample code snippet to have the checkbox  persist its state as well as the expanded state.

    ASPX:
    <telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server">
        <telerik:RadGrid ID="RadGrid" runat="server" RetainExpandStateOnRebind="true" OnDetailTableDataBind="RadGridPatientData_DetailTableDataBind" OnNeedDataSource="RadGridPatientData_NeedDataSource" OnItemDataBound="RadGridPatientData_ItemDataBound">
      <MasterTableView DataMember="Country" DataKeyNames="CountryID" HierarchyLoadMode="Client" Name="Country">
                <DetailTables>
                    <telerik:GridTableView DataKeyNames="StateID" Name="State" HierarchyLoadMode="Client" RetainExpandStateOnRebind="true" DataMember="State">
                        <DetailTables>
                            <telerik:GridTableView DataKeyNames="StateID,DistrictID" Name="District" RetainExpandStateOnRebind="true" DataMember="District">
                                <Columns>
                                    <telerik:GridTemplateColumn HeaderText="">
                                        <ItemTemplate>
                                            <asp:CheckBox ID="chkSelectDoc" runat="server" AutoPostBack="true" OnCheckedChanged="chkSelectDoc_CheckChanged" />
                                        </ItemTemplate>
                                    </telerik:GridTemplateColumn>
                                </Columns>
                            </telerik:GridTableView>
                        </DetailTables>
                    </telerik:GridTableView>
                </DetailTables>
            </MasterTableView>
            <ClientSettings>
                <Scrolling AllowScroll="true" ScrollHeight="400px" UseStaticHeaders="true" />
                <Selecting AllowRowSelect="true" />
            </ClientSettings>
        </telerik:RadGrid>
    </telerik:RadAjaxPanel>

    C#:
    protected void RadGridPatientData_NeedDataSource(object sender, Telerik.Web.UI.GridNeedDataSourceEventArgs e)
    {
        if (!e.IsFromDetailTable)
        {
           RadGrid.DataSource = GetDataTable("Select * from Country");
        }
    }
    protected void RadGridPatientData_DetailTableDataBind(object source, Telerik.Web.UI.GridDetailTableDataBindEventArgs e)
    {
        GridDataItem dataItem = (GridDataItem)e.DetailTableView.ParentItem;
        switch (e.DetailTableView.Name)
        {
            case "State":
                {
                    string CountryID = dataItem.GetDataKeyValue("CountryID").ToString();
                    e.DetailTableView.DataSource = GetDataTable("SELECT * FROM State WHERE CountryID = '" + CountryID + "'");
                    break;
                }
            case "District":
                {
                    string StateID = dataItem.GetDataKeyValue("StateID").ToString();
                    e.DetailTableView.DataSource = GetDataTable("SELECT * FROM District WHERE StateID = '" + StateID + "'");
                    break;
                }
        }
    }
     
    public DataTable GetDataTable(string query)
    {
        String ConnString = ConfigurationManager.ConnectionStrings["ConnectionString"].ConnectionString;
        SqlConnection conn = new SqlConnection(ConnString);
        SqlDataAdapter adapter = new SqlDataAdapter();
        adapter.SelectCommand = new SqlCommand(query, conn);
     
        DataTable myDataTable = new DataTable();
     
        conn.Open();
        try
        {
            adapter.Fill(myDataTable);
        }
        finally
        {
            conn.Close();
        }
     
        return myDataTable;
    }
    protected void chkSelectDoc_CheckChanged(object sender, EventArgs e)
    {
        CheckBox box = (CheckBox)sender;
        GridDataItem item = (GridDataItem)box.NamingContainer;
        Hashtable target = null;      
        if (item.OwnerTableView.DataMember == "District")
        {
            target = DistrictChecked;
        }
     
        if (box.Checked)
        {
            target[item["DistrictID"].Text] = true;
        }
        else
        {
            target[item["DistrictID"].Text] = null;
        }
    }
     
    private Hashtable DistrictChecked
    {
        get
        {
            object res = ViewState["_cc2"];
            if (res == null)
            {
                res = new Hashtable();
                ViewState["_cc2"] = res;
            }
     
            return (Hashtable)res;
        }
    }
     
    protected void RadGridPatientData_ItemDataBound(object sender, GridItemEventArgs e)
    {
        if (e.Item is GridDataItem)
        {
            GridDataItem item = e.Item as GridDataItem;
            CheckBox box = (CheckBox)item.FindControl("chkSelectDoc");
            object isChecked = null;          
            if (item.OwnerTableView.DataMember == "District")
            {
                isChecked = DistrictChecked[item["DistrictID"].Text];
            }
            if (isChecked != null)
            {
                box.Checked = (bool)isChecked == true;
            }
        }  
    }

    Thanks,
    Shinu
  3. Cindy
    Cindy avatar
    10 posts
    Member since:
    Nov 2012

    Posted 29 Dec 2015 in reply to Shinu Link to this post

    I set the RetainExpandStateOnRebind property of the grid = true and on the detail tables as well.  Still does not work.

     

        <telerik:RadGrid ID="RadGrid1" runat="server" Width="95%" ShowStatusBar="true" AutoGenerateColumns="False" PageSize="700" AllowSorting="True"
             AllowMultiRowSelection="False" AllowPaging="False" OnDetailTableDataBind="RadGrid1_DetailTableDataBind" Skin="Office2007" 
            OnNeedDataSource="RadGrid1_NeedDataSource" OnItemDataBound="RadGrid1_ItemDataBound" OnPreRender="RadGrid1_PreRender" ShowGroupPanel="true"
             ShowFooter="false" GridLines="None" GroupingSettings-RetainGroupFootersVisibility="true" RetainExpandStateOnRebind="true">
            <PagerStyle Mode="NumericPages"></PagerStyle>
            <ClientSettings AllowKeyboardNavigation="true" EnablePostBackOnRowClick="true">
                <Selecting AllowRowSelect="true"></Selecting>
            </ClientSettings>
            <MasterTableView Width="100%" DataKeyNames="CC" AllowMultiColumnSorting="True" ShowHeader="false" HierarchyLoadMode="Conditional">
                <Columns>
                    <telerik:GridBoundColumn DataField="Zone"></telerik:GridBoundColumn>
                </Columns>
                <DetailTables>
                    <telerik:GridTableView DataKeyNames="CustomerName" Name="ServiceCC" Width="100%" ShowHeader="false" HierarchyLoadMode="Conditional" RetainExpandStateOnRebind="true">
                        <DetailTables>
                            <telerik:GridTableView DataKeyNames="ID" Name="Customers" Width="100%" HierarchyLoadMode="Conditional" RetainExpandStateOnRebind="true">
                                <DetailTables>
                                    <telerik:GridTableView DataKeyNames="AlertID" Name="Responses" Width="100%" HierarchyLoadMode="Conditional" RetainExpandStateOnRebind="true">
                                        <Columns>
                                            <telerik:GridBoundColumn SortExpression="AlertID" HeaderText="" Visible="false" HeaderButtonType="TextButton" 
                                                DataField="AlertID">
                                            </telerik:GridBoundColumn>
                                            <telerik:GridTemplateColumn HeaderText="Response Title" ItemStyle-CssClass="dcol1"  HeaderButtonType="TextButton" UniqueName="ResponseTitle">
                                                <ItemTemplate>
                                                    <asp:Label ID="lblResponseTitle" runat="server" Text='<%#Eval("Title") %>'></asp:Label>
                                                </ItemTemplate>
                                            </telerik:GridTemplateColumn>
                                            <telerik:GridTemplateColumn HeaderText="Assigned To" ItemStyle-CssClass="dcol3"  HeaderButtonType="TextButton" UniqueName="AssignedTo">
                                                <ItemTemplate>
                                                    <asp:Label ID="lblAssignedTo" runat="server" Text='<%#Eval("AssignedTo") %>'></asp:Label>
                                                </ItemTemplate>
                                            </telerik:GridTemplateColumn>
                                            <telerik:GridTemplateColumn HeaderText="Response Status" ItemStyle-CssClass="dcol4"  HeaderButtonType="TextButton" UniqueName="ResponseStatus">
                                                <ItemTemplate>
                                                    <asp:Label ID="lblResponseStatus" runat="server" Text='<%#Eval("Status") %>'></asp:Label>
                                                </ItemTemplate>
                                            </telerik:GridTemplateColumn>
                                            <telerik:GridTemplateColumn HeaderText="Response Created By" ItemStyle-CssClass="dcol5"  HeaderButtonType="TextButton" UniqueName="ResponseAuthor">
                                                <ItemTemplate>
                                                    <asp:Label ID="lblResponseAuthor" runat="server" Text='<%#Eval("Author") %>'></asp:Label>
                                                </ItemTemplate>
                                            </telerik:GridTemplateColumn>
                                            <telerik:GridBoundColumn SortExpression="Created" HeaderText="Response Created" HeaderButtonType="TextButton" DataField="Created" DataFormatString="{0:M/d/yyyy}"></telerik:GridBoundColumn>
                                            <telerik:GridTemplateColumn HeaderText="ID" HeaderButtonType="TextButton" UniqueName="ID" Visible="true">
                                                <ItemTemplate>
                                                    <asp:Label ID="lblID" runat="server" Text='<%#Eval("ID") %>'></asp:Label>
                                                </ItemTemplate>
                                            </telerik:GridTemplateColumn>
                                            <telerik:GridTemplateColumn DataField="Comments" ItemStyle-CssClass="dcol7"  UniqueName="Comments" HeaderText="Response Comment History">
                                                <ItemTemplate>
                                                    <uc1:Comments runat="server" ID="ctrlComments" />
                                                    <uc3:CustomEmail runat="server" ID="CustomEmail" />
                                                </ItemTemplate>
                                            </telerik:GridTemplateColumn>
                                        </Columns>
                                    </telerik:GridTableView>
                                </DetailTables>
                                <Columns>
                                    <telerik:GridBoundColumn SortExpression="ID" HeaderText="" Visible="false"  HeaderButtonType="TextButton" DataField="ID"></telerik:GridBoundColumn>
                                    <telerik:GridTemplateColumn HeaderText="Alert Title" ItemStyle-Width="200px" ItemStyle-CssClass="acol1"  HeaderButtonType="TextButton" UniqueName="Title">
                                        <ItemTemplate>
                                            <asp:HyperLink ID="HyperLink1" runat="server" Target="_blank" NavigateUrl='<%# DataBinder.Eval(Container.DataItem, "Url") %>'><%# DataBinder.Eval(Container.DataItem, "Title") %></asp:HyperLink>
                                        </ItemTemplate>
                                    </telerik:GridTemplateColumn>
                                    <telerik:GridTemplateColumn HeaderText="Alert Description" ItemStyle-Width="400px" ItemStyle-CssClass="acol2"  HeaderButtonType="TextButton" UniqueName="Description">
                                        <ItemTemplate>
                                            <asp:Label ID="lblDescription" runat="server" Text='<%#Eval("Description") %>'></asp:Label>
                                        </ItemTemplate>
                                    </telerik:GridTemplateColumn>
                                    <telerik:GridTemplateColumn HeaderText="Alert Sub Type" ItemStyle-CssClass="acol3"  HeaderButtonType="TextButton" UniqueName="SubType">
                                        <ItemTemplate>
                                            <asp:Label ID="lblSubType" runat="server" Text='<%#Eval("SubType") %>'></asp:Label>
                                        </ItemTemplate>
                                    </telerik:GridTemplateColumn>
                                    <telerik:GridTemplateColumn HeaderText="Areas of Impact" ItemStyle-CssClass="acol3"  HeaderButtonType="TextButton" UniqueName="AlertArea">
                                        <ItemTemplate>
                                            <asp:Label ID="lblAlertArea" runat="server" Text='<%#Eval("AlertArea") %>'></asp:Label>
                                        </ItemTemplate>
                                    </telerik:GridTemplateColumn>
                                    <telerik:GridTemplateColumn HeaderText="Alert Owner" ItemStyle-CssClass="acol4"  HeaderButtonType="TextButton" UniqueName="Owner">
                                        <ItemTemplate>
                                            <asp:Label ID="lblOwner" runat="server" Text='<%#Eval("Owner") %>'></asp:Label>
                                        </ItemTemplate>
                                    </telerik:GridTemplateColumn>
                                    <telerik:GridTemplateColumn HeaderText="Alert Created By" ItemStyle-CssClass="acol5"  HeaderButtonType="TextButton" UniqueName="Author">
                                        <ItemTemplate>
                                            <asp:Label ID="lblAuthor" runat="server" Text='<%#Eval("Author") %>'></asp:Label>
                                        </ItemTemplate>
                                    </telerik:GridTemplateColumn>
                                    <telerik:GridBoundColumn SortExpression="Created" HeaderText="Alert Created" HeaderButtonType="TextButton" DataField="Created" DataFormatString="{0:M/d/yyyy}"></telerik:GridBoundColumn>
                                </Columns>
                            </telerik:GridTableView>
                        </DetailTables>
                        <Columns>
                                <telerik:GridBoundColumn SortExpression="CustomerName" HeaderText="Customer" HeaderButtonType="TextButton" DataField="CustomerName"></telerik:GridBoundColumn>
                                <telerik:GridBoundColumn Visible="false" SortExpression="CC" HeaderText="CC" HeaderButtonType="TextButton" DataField="CC"></telerik:GridBoundColumn>
                        </Columns>
                    </telerik:GridTableView>
                </DetailTables>
                <Columns>
                    <telerik:GridBoundColumn SortExpression="CC" HeaderText="" HeaderButtonType="TextButton" DataField="CC">
                    </telerik:GridBoundColumn>
                </Columns>
            </MasterTableView>
            </telerik:RadGrid>

  4. Pavlina
    Admin
    Pavlina avatar
    6121 posts

    Posted 30 Dec 2015 Link to this post

    Hello,

    Indeed there is a problem with RetainExpandStateOnRebind property of the grid which is a known one and our developers will fix it as soon as possible. Meanwhile you can use the approach presented in the following code library to persist the expanded/selected state of hierarchy grid on Rebind: 
    http://www.telerik.com/support/code-library/retain-expanded-selected-state-in-hierarchy-on-rebind

    Regards,
    Pavlina
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  5. Chris
    Chris avatar
    1 posts
    Member since:
    Sep 2014

    Posted 27 Feb in reply to Pavlina Link to this post

    Any update on this? We have set the same property but it is not working. We are using 2015.2.623.35 version
  6. Pavlina
    Admin
    Pavlina avatar
    6121 posts

    Posted 02 Mar Link to this post

    Hello,

    Could you confirm that the same problem exists with the latest release of ASP.NET AJAX? In case RetainExpandStateOnRebind is not working with version 2017.1.228, please isolate the issue in a runnable project and send it to us. We will debug it locally and in case the bug still exists we we will log it in our bug tracking system and will fix it as soon as possible.

    Regards,
    Pavlina
    Telerik by Progress
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top