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

[Solved] Hierarchical grid, 2 frozen columns, problem with horizontal scrolling

10 Answers 404 Views

Grid

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

RadTony asked on 29 Jan 2010, 01:46 PM

I'm using the following code ( http://demos.telerik.com/aspnet-ajax/grid/examples/hierarchy/selfreferencing/defaultcs.aspx ) to test if it is possible to scroll horizontally a hierarchical rad grid having one or more left columns frozen. When I freeze a column with FrozenColumnsCount="1", only the first row is scrollable and all others do't scroll ... I'm using selfreferencing hierarchy because I need it. Thanks for your help.

                    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="RadGridTest3.aspx.cs" Inherits="RadGridTest3" %>         
                     
                     
            <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>         
            <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">         
            <html xmlns="http://www.w3.org/1999/xhtml">         
            <head>         
            <title>Test Radgrids</title>          
            </head>         
            <body>         
                <form runat="server" id="mainForm" method="post">         
                <div style="width:300px">         
                  <telerik:RadScriptManager ID="RadScriptManager1" runat="server" />         
                    <!-- content start -->         
                    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">         
                        <AjaxSettings>         
                            <telerik:AjaxSetting AjaxControlID="RadGrid1">         
                                <UpdatedControls>         
                                    <telerik:AjaxUpdatedControl ControlID="RadGrid1" />         
                                </UpdatedControls>         
                            </telerik:AjaxSetting>         
                        </AjaxSettings>         
                    </telerik:RadAjaxManager>         
                    <telerik:RadGrid ID="RadGrid1" runat="server" DataSourceID="SqlDataSource1" OnColumnCreated="RadGrid1_ColumnCreated"         
                        OnItemCreated="RadGrid1_ItemCreated" OnItemDataBound="RadGrid1_ItemDataBound">         
                        <MasterTableView HierarchyDefaultExpanded="true" HierarchyLoadMode="Client" AllowSorting="true"         
                            DataKeyNames="EmployeeID, ReportsTo" Width="100%">         
                            <SelfHierarchySettings ParentKeyName="ReportsTo" KeyName="EmployeeID" />         
                        </MasterTableView>         
                        <HeaderStyle width="300px"/>         
                            <ClientSettings AllowExpandCollapse="true">         
                                <Scrolling AllowScroll="True" UseStaticHeaders="True" FrozenColumnsCount="1">         
                                </Scrolling>         
                            </ClientSettings>         
                    </telerik:RadGrid>         
                 </div>         
                    <asp:SqlDataSource ID="SqlDataSource1" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"         
                        ProviderName="System.Data.SqlClient" SelectCommand="SELECT EmployeeID, LastName, FirstName, Title, ReportsTo FROM Employees"         
                        runat="server"></asp:SqlDataSource>         
                </form>         
            </body>         
            </html>         

10 Answers, 1 is accepted

answered on 29 Jan 2010, 02:35 PM

website-frozen-column.zip

Hello Panin,

Attached to this message is a simple working application which handles the required functionality. Please, check it out and see if it works for you.

I hope this gets you started properly.

Greetings,
Pavlina
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

answered on 29 Jan 2010, 03:31 PM

website2.zip

Hi Panin,

Please excuse me, here is the project.

All the best,
Pavlina
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

answered on 29 Jan 2010, 04:03 PM

Hi,

This time I received all your files. But the behavior was exactly the same as what I've done before : I mean, only the first row and the header are scrolled horizontally and all other rows are frozen.

You'll reply that it works perfectly at your site ... I already done this with devXpress (I put an AspxTreeList on the left and an AspxGridView on the right which gets scrolled in a div). My project manager wants me to get it done with Telerik components because we have already got them ... The problem is : I can't make it work. May be something is missing ... I tried in internet explorer, chrome, firefox but it doesn't work in any navigator.

How can you help me ?!

-Panin

answered on 01 Feb 2010, 09:55 AM

Hi,

I was working with a trial version. Now that I have installed a real version of your product, I realized that only "parent rows" can be horizontally scrolled. I'm refering to the code you gave me : website2.zip

For example, when all rows are collapsed, the horizontal scrolling is working perfectly with the first row frozen ...

When I expand a parent row, all rows are scrollable expect the child rows belong to the one parent row ...

how to get the child rows scrollable at the same time ?

thanks in advance,

answered on 01 Feb 2010, 04:39 PM

Hello Pavlina,

I must not add scrolling to inner tables due to requirements : only one main horizontal scrolling with frozen columns (like Excel).

What I need is scrolling done even when child rows are expanded.

According to DevXpress, this is impossible to do on web due to rendering in pixels. Only static data (I mean not grouping or hierarchical) can be scrolled with frozen columns ...

Actually, can you please give me a sample solution with two radGrids ? One radGrid stays on the left part of the screen, and the other one is scrollable. What I want is that, when one "parent row" is expanded on Grid1 then Grid2 also get expanded for that parent row. The idea is to have these two grids displaying the same data when one of the rows in Grid1 is expanded.

I'm already on my way doing this (see attachment). I can't hide expand/collapse button when there are no child rows (please see my code, I have always nestedView.Items.Count == 0 ). My next step is to define the datasource in server-side for radGrid2 each time when the expand/collapse button is clicked.

Please tell me how to hide "expand/collapse " button when there are no child rows.

                    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="RadGridDataOK11.aspx.cs" Inherits="TelerikGrids1.RadGridDataOK11" %>         
                     
            <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>         
            <!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 id="Head1" runat="server">         
                <title></title>         
                <style type="text/css">         
                  .StaticColumn         
                  {             
                      font-family: Arial,Verdana, Helvetica;         
                    font-size: 14px;         
                    font-weight: normal;            
                      border: none;         
                      position: relative;         
                  }          
                     
                </style>             
            </head>         
            <body>         
                <form runat="server" id="mainForm" method="post">                 
                 <telerik:RadScriptManager ID="RadScriptManager1" runat="server" />         
                    <!-- content start -->         
                    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">         
                        <AjaxSettings>         
                            <telerik:AjaxSetting AjaxControlID="RadGrid1">         
                                <UpdatedControls>         
                                    <telerik:AjaxUpdatedControl ControlID="RadGrid1" />         
                                </UpdatedControls>         
                            </telerik:AjaxSetting>         
                        </AjaxSettings>         
                    </telerik:RadAjaxManager>         
                    <table border="0" cellspacing="0" cellpadding="0" style="height:100%; width:100%">          
                    <tr>         
                    <td style="vertical-align:top;height:100%">         
                    <telerik:RadGrid ID="RadGrid1" OnPreRender="RadGrid1_PreRender" ShowStatusBar="true" DataSourceID="SqlDataSource1"         
                        runat="server" AutoGenerateColumns="False" PageSize="20" AllowSorting="True" AllowMultiRowSelection="False"         
                        AllowPaging="True" GridLines="None" OnColumnCreated="RadGrid1_ColumnCreated" OnItemCreated="RadGrid1_ItemCreated"          
                        OnItemDataBound="RadGrid1_ItemDataBound">         
                        <PagerStyle Mode="NumericPages"></PagerStyle>         
                        <MasterTableView DataSourceID="SqlDataSource1" DataKeyNames="EmployeeID" AllowMultiColumnSorting="True" ItemStyle-Wrap="false" Height="20px">         
                            <DetailTables>         
                                <telerik:GridTableView DataKeyNames="EmployeeID" DataSourceID="SqlDataSource2" Width="100%" runat="server" ShowHeader="false">         
                                    <ParentTableRelation>         
                                        <telerik:GridRelationFields DetailKeyField="ReportsTo" MasterKeyField="EmployeeID" />         
                                    </ParentTableRelation>                                                         
                                    <Columns>                                 
                                 <telerik:GridBoundColumn SortExpression="EmployeeID" HeaderText="EmployeeID" HeaderButtonType="TextButton"         
                                    DataField="EmployeeID" UniqueName="EmployeeID" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="20px">         
                                </telerik:GridBoundColumn>         
                                <telerik:GridBoundColumn SortExpression="LastName" HeaderText="LastName" HeaderButtonType="TextButton"         
                                    DataField="LastName" UniqueName="LastName" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="20px">         
                                </telerik:GridBoundColumn>         
                                <telerik:GridBoundColumn SortExpression="FirstName" HeaderText="FirstName" HeaderButtonType="TextButton"         
                                    DataField="FirstName" UniqueName="FirstName" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="20px">         
                                </telerik:GridBoundColumn>         
                                         
                                <telerik:GridBoundColumn SortExpression="Title" HeaderText="Title" HeaderButtonType="TextButton"         
                                    DataField="Title" UniqueName="Title" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="20px">         
                                </telerik:GridBoundColumn>         
                                <telerik:GridBoundColumn SortExpression="ReportsTo" HeaderText="ReportsTo" HeaderButtonType="TextButton"         
                                    DataField="ReportsTo" UniqueName="ReportsTo" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="20px">         
                                </telerik:GridBoundColumn>                                                 
                                    </Columns>         
                                </telerik:GridTableView>         
                            </DetailTables>         
                            <Columns>         
                                <telerik:GridBoundColumn SortExpression="EmployeeID" HeaderText="EmployeeID" HeaderButtonType="TextButton"         
                                    DataField="EmployeeID" UniqueName="EmployeeID" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="20px">         
                                </telerik:GridBoundColumn>         
                                <telerik:GridBoundColumn SortExpression="LastName" HeaderText="LastName" HeaderButtonType="TextButton"         
                                    DataField="LastName" UniqueName="LastName" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="20px">         
                                </telerik:GridBoundColumn>         
                                <telerik:GridBoundColumn SortExpression="FirstName" HeaderText="FirstName" HeaderButtonType="TextButton"         
                                    DataField="FirstName" UniqueName="FirstName" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="20px">         
                                </telerik:GridBoundColumn>         
                                <telerik:GridBoundColumn SortExpression="Title" HeaderText="Title" HeaderButtonType="TextButton"         
                                    DataField="Title" UniqueName="Title" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="20px">         
                                </telerik:GridBoundColumn>         
                                <telerik:GridBoundColumn SortExpression="ReportsTo" HeaderText="ReportsTo" HeaderButtonType="TextButton"         
                                    DataField="ReportsTo" UniqueName="ReportsTo" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="20px">         
                                </telerik:GridBoundColumn>                             
                            </Columns>         
                        </MasterTableView>         
                    </telerik:RadGrid>         
                    </td>         
                    <td class="StaticColumn" style="vertical-align:top;height:100%;">          
                    <telerik:RadGrid ID="RadGrid2" ShowStatusBar="true" DataSourceID="SqlDataSource1"         
                        runat="server" AutoGenerateColumns="False" PageSize="20" AllowSorting="True" AllowMultiRowSelection="False" Width="50%"         
                        AllowPaging="True" GridLines="None">         
                        <PagerStyle Mode="NumericPages"></PagerStyle>         
                        <MasterTableView ItemStyle-Wrap="false" Height="20px">                         
                            <Columns>         
                                <telerik:GridBoundColumn SortExpression="EmployeeID" HeaderText="EmployeeID" HeaderButtonType="TextButton"         
                                    DataField="EmployeeID" UniqueName="EmployeeID" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="20px">         
                                </telerik:GridBoundColumn>         
                                <telerik:GridBoundColumn SortExpression="LastName" HeaderText="LastName" HeaderButtonType="TextButton"         
                                    DataField="LastName" UniqueName="LastName" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="20px">         
                                </telerik:GridBoundColumn>         
                                <telerik:GridBoundColumn SortExpression="FirstName" HeaderText="FirstName" HeaderButtonType="TextButton"         
                                    DataField="FirstName" UniqueName="FirstName" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="20px">         
                                </telerik:GridBoundColumn>         
                                <telerik:GridBoundColumn SortExpression="Title" HeaderText="Title" HeaderButtonType="TextButton"         
                                    DataField="Title" UniqueName="Title" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="20px">         
                                </telerik:GridBoundColumn>         
                                <telerik:GridBoundColumn SortExpression="ReportsTo" HeaderText="ReportsTo" HeaderButtonType="TextButton"         
                                    DataField="ReportsTo" UniqueName="ReportsTo" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="20px">         
                                </telerik:GridBoundColumn>          
                                <telerik:GridBoundColumn SortExpression="EmployeeID" HeaderText="EmployeeID" HeaderButtonType="TextButton"         
                                    DataField="EmployeeID" UniqueName="EmployeeID" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="20px">         
                                </telerik:GridBoundColumn>         
                                <telerik:GridBoundColumn SortExpression="LastName" HeaderText="LastName" HeaderButtonType="TextButton"         
                                    DataField="LastName" UniqueName="LastName" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="20px">         
                                </telerik:GridBoundColumn>         
                                <telerik:GridBoundColumn SortExpression="FirstName" HeaderText="FirstName" HeaderButtonType="TextButton"         
                                    DataField="FirstName" UniqueName="FirstName" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="20px">         
                                </telerik:GridBoundColumn>         
                                <telerik:GridBoundColumn SortExpression="Title" HeaderText="Title" HeaderButtonType="TextButton"         
                                    DataField="Title" UniqueName="Title" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="20px">         
                                </telerik:GridBoundColumn>         
                                <telerik:GridBoundColumn SortExpression="ReportsTo" HeaderText="ReportsTo" HeaderButtonType="TextButton"         
                                    DataField="ReportsTo" UniqueName="ReportsTo" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="20px">         
                                </telerik:GridBoundColumn>              
                                <telerik:GridBoundColumn SortExpression="EmployeeID" HeaderText="EmployeeID" HeaderButtonType="TextButton"         
                                    DataField="EmployeeID" UniqueName="EmployeeID" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="20px">         
                                </telerik:GridBoundColumn>         
                                <telerik:GridBoundColumn SortExpression="LastName" HeaderText="LastName" HeaderButtonType="TextButton"         
                                    DataField="LastName" UniqueName="LastName" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="20px">         
                                </telerik:GridBoundColumn>         
                                <telerik:GridBoundColumn SortExpression="FirstName" HeaderText="FirstName" HeaderButtonType="TextButton"         
                                    DataField="FirstName" UniqueName="FirstName" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="20px">         
                                </telerik:GridBoundColumn>         
                                <telerik:GridBoundColumn SortExpression="Title" HeaderText="Title" HeaderButtonType="TextButton"         
                                    DataField="Title" UniqueName="Title" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="20px">         
                                </telerik:GridBoundColumn>         
                                <telerik:GridBoundColumn SortExpression="ReportsTo" HeaderText="ReportsTo" HeaderButtonType="TextButton"         
                                    DataField="ReportsTo" UniqueName="ReportsTo" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="20px">         
                                </telerik:GridBoundColumn>          
                                <telerik:GridBoundColumn SortExpression="EmployeeID" HeaderText="EmployeeID" HeaderButtonType="TextButton"         
                                    DataField="EmployeeID" UniqueName="EmployeeID" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="20px">         
                                </telerik:GridBoundColumn>         
                                <telerik:GridBoundColumn SortExpression="LastName" HeaderText="LastName" HeaderButtonType="TextButton"         
                                    DataField="LastName" UniqueName="LastName" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="20px">         
                                </telerik:GridBoundColumn>         
                                <telerik:GridBoundColumn SortExpression="FirstName" HeaderText="FirstName" HeaderButtonType="TextButton"         
                                    DataField="FirstName" UniqueName="FirstName" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="20px">         
                                </telerik:GridBoundColumn>         
                                <telerik:GridBoundColumn SortExpression="Title" HeaderText="Title" HeaderButtonType="TextButton"         
                                    DataField="Title" UniqueName="Title" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="20px">         
                                </telerik:GridBoundColumn>         
                                <telerik:GridBoundColumn SortExpression="ReportsTo" HeaderText="ReportsTo" HeaderButtonType="TextButton"         
                                    DataField="ReportsTo" UniqueName="ReportsTo" ItemStyle-Wrap="false" ItemStyle-Width="200px" ItemStyle-Height="20px">         
                                </telerik:GridBoundColumn>                                                                 
                            </Columns>         
                        </MasterTableView>         
                        <clientsettings allowexpandcollapse="false" >                         
                                <Scrolling AllowScroll="true" UseStaticHeaders="True"></Scrolling>         
                        </clientsettings>         
                    </telerik:RadGrid>         
                    </td>         
                    </tr>         
                    </table>         
                    <asp:SqlDataSource ID="SqlDataSource1" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString2 %>"         
                        ProviderName="System.Data.SqlClient" SelectCommand="SELECT [EmployeeID], [LastName], [FirstName], [Title], [ReportsTo] FROM [Employees]"         
                        runat="server"></asp:SqlDataSource>         
                    <asp:SqlDataSource ID="SqlDataSource2" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString2 %>"         
                        ProviderName="System.Data.SqlClient" SelectCommand="SELECT [EmployeeID], [LastName], [FirstName], [Title], [ReportsTo] FROM [Employees] Where ReportsTo = @ReportsTo"         
                        runat="server">         
                        <SelectParameters>         
                            <asp:SessionParameter Name="ReportsTo" SessionField="ReportsTo" Type="string" />         
                        </SelectParameters>         
                    </asp:SqlDataSource>         
                    </form>         
            </body>         
            </html>         
            ---------------------------------------------------------------------         
            ---------------------------------------------------------------------         
            ---------------------------------------------------------------------         
            ---------------------------------------------------------------------         
                     
                     
                     
            using System;         
            using System.Collections.Generic;         
            using System.Linq;         
            using System.Web;         
            using System.Web.UI;         
            using System.Web.UI.WebControls;         
            using System.Data.OleDb;         
            using System.Data;         
            using Telerik.Web.UI;         
            using System.Reflection;         
                     
            namespace TelerikGrids1         
            {         
                public partial class RadGridDataOK11 : System.Web.UI.Page         
                {         
                    protected void RadGrid1_PreRender(object sender, EventArgs e)         
                    {         
                        if (!Page.IsPostBack)         
                        {         
                            /*         
                            RadGrid1.MasterTableView.Items[0].Expanded = true;         
                            RadGrid1.MasterTableView.Items[0].ChildItem.NestedTableViews[0].Items[0].Expanded = true;         
                             */         
                        }         
                    }         
                     
                    protected void RadGrid1_ColumnCreated(object sender, GridColumnCreatedEventArgs e)         
                    {         
                        e.Column.ItemStyle.Width = Unit.Pixel(150);         
                        e.Column.ItemStyle.Height = Unit.Pixel(20);         
                        e.Column.HeaderStyle.Width = Unit.Pixel(150);         
                        e.Column.HeaderStyle.Height = Unit.Pixel(20);         
                        e.Column.FooterStyle.Width = Unit.Pixel(150);         
                        e.Column.FooterStyle.Height = Unit.Pixel(20);         
                     
                     
                     
                        if (e.Column is GridExpandColumn)         
                        {         
                            e.Column.Visible = false;         
                        }         
                        else if (e.Column is GridBoundColumn)         
                        {         
                            e.Column.HeaderStyle.Width = Unit.Pixel(150);         
                        }         
                        //e.Column is GridTemplateColumn         
                    }         
                     
                    public void Page_Load(object sender, EventArgs e)         
                    {         
                        if (Assembly.GetAssembly(typeof(ScriptManager)).FullName.IndexOf("3.5") != -1)         
                        {         
                            RadGrid1.MasterTableView.FilterExpression = @"it[""ReportsTo""] = Convert.DBNull";         
                        }         
                        else         
                        {         
                            RadGrid1.MasterTableView.FilterExpression = "ReportsTo IS NULL";         
                        }         
                    }         
                     
                    public void Page_PreRenderComplete(object sender, EventArgs e)         
                    {         
                        HideExpandColumnRecursive(RadGrid1.MasterTableView);         
                    }         
                     
                             
                    public void HideExpandColumnRecursive(GridTableView tableView)         
                    {         
                        GridItem[] nestedViewItems = tableView.GetItems(GridItemType.NestedView);         
                        foreach (GridNestedViewItem nestedViewItem in nestedViewItems)         
                        {         
                            foreach (GridTableView nestedView in nestedViewItem.NestedTableViews)         
                            {         
                                nestedView.Style["border"] = "0";         
                     
                                Button MyExpandCollapseButton = (Button)nestedView.ParentItem.FindControl("MyExpandCollapseButton");         
                                /*         
                                if (nestedView.Items.Count == 0)         
                                {         
                                    if (MyExpandCollapseButton != null)         
                                    {         
                                        MyExpandCollapseButton.Style["visibility"] = "hidden";         
                                    }         
                                    nestedViewItem.Visible = false;         
                                }         
                                else         
                                {         
                                    if (MyExpandCollapseButton != null)         
                                    {         
                                        MyExpandCollapseButton.Style.Remove("visibility");         
                                    }         
                                }         
                                */         
                                if (nestedView.HasDetailTables)         
                                {         
                                    HideExpandColumnRecursive(nestedView);         
                                }         
                            }         
                        }         
                    }         
                             
                     
                    protected void RadGrid1_ItemCreated(object sender, GridItemEventArgs e)         
                    {         
                        CreateExpandCollapseButton(e.Item, "EmployeeID");         
                     
                        if (e.Item is GridHeaderItem && e.Item.OwnerTableView != RadGrid1.MasterTableView)         
                        {         
                            e.Item.Style["display"] = "none";         
                            e.Item.Style["Width"] = "150px";         
                            e.Item.Style["Height"] = "20px";         
                        }         
                     
                        if (e.Item is GridNestedViewItem)         
                        {         
                            e.Item.Cells[0].Visible = false;         
                            e.Item.Style["Width"] = "150px";         
                            e.Item.Style["Height"] = "20px";         
                        }         
                    }         
                     
                    protected void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e)         
                    {         
                        CreateExpandCollapseButton(e.Item, "EmployeeID");         
                    }         
                     
                    public void CreateExpandCollapseButton(GridItem item, string columnUniqueName)         
                    {         
                        if (item is GridDataItem)         
                        {         
                            if (item.FindControl("MyExpandCollapseButton") == null)         
                            {         
                                Button button = new Button();         
                                button.Click += new EventHandler(button_Click);         
                                button.CommandName = "ExpandCollapse";         
                                button.CssClass = (item.Expanded) ? "rgCollapse" : "rgExpand";         
                                button.ID = "MyExpandCollapseButton";         
                     
                                if (item.OwnerTableView.HierarchyLoadMode == GridChildLoadMode.Client)         
                                {         
                                    string script = String.Format(@"$find(""{0}"")._toggleExpand(this, event); return false;", item.Parent.Parent.ClientID);         
                     
                                    button.OnClientClick = script;         
                                }         
                     
                                int level = item.ItemIndexHierarchical.Split(':').Length;         
                                if (level > 1)         
                                {         
                                    button.Style["margin-left"] = level + 10 + "px";         
                                }         
                     
                                TableCell cell = ((GridDataItem)item)[columnUniqueName];         
                                cell.Controls.Add(button);         
                                cell.Controls.Add(new LiteralControl("&nbsp;"));         
                                cell.Controls.Add(new LiteralControl(((GridDataItem)item).GetDataKeyValue(columnUniqueName).ToString()));         
                            }         
                        }         
                    }         
                     
                    void button_Click(object sender, EventArgs e)         
                    {         
                        ((Button)sender).CssClass = (((Button)sender).CssClass == "rgExpand") ? "rgCollapse" : "rgExpand";         
                    }         
                }         
            }         

answered on 04 Feb 2010, 12:18 PM

Hello,

You may want to hide the expand/collapse images when there are not records under parent grid item and you choose HierarchyLoadMode = ServerOnDemand or HierarchyLoadMode = ServerBind options for loading grid hierarchy. For more information about how to accomplish this task please refer to the following help article:
Hiding expand/collapse images when no records

Regards,
Pavlina
the Telerik team

Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
Follow the status of features or bugs in PITS and vote for them to affect their priority.

answered on 04 Feb 2010, 01:56 PM

Hi Pavlina,

Actually, I'm working with 2 RadGrids instead of one hierarchical grid with frozen columns ... I posted my code here :

http://www.telerik.com/community/forums/aspnet-ajax/grid/two-grids-can-t-get-the-same-height-for-both-of-them.aspx

As I can't scroll all rows in a hierarchical grid while having frozen columns (http://www.telerik.com/help/aspnet-ajax/grdstaticcolumns.html says : When using frozen columns in a hierarchical grid, only the columns of the master table are frozen.) ...

I use 2 RadGrids : first one for frozen columns and the second one for scrolling details ... When expanding rows in the first grid, I refresh the second one with the same data ...

I hope one day we'll get a multi-column treeview (or gridview) component with frozen columns ...