I have followed the code provided in the self-referencing hierarchy demo (http://demos.telerik.com/aspnet-ajax/grid/examples/hierarchy/selfreferencing/defaultcs.aspx) exactly, but I am having trouble with the columns in nested details table not lining correctly.
My radgrid looks like this
<style type="text/css"> .RadGrid td { padding: 0; } </style> <telerik:RadGrid ID="rgTasks" runat="server" OnNeedDataSource="rgTasks_NeedDataSource" Skin="Hay" OnColumnCreated="RadGrid1_ColumnCreated" OnItemCreated="RadGrid1_ItemCreated" OnItemDataBound="RadGrid1_ItemDataBound"> <MasterTableView CommandItemDisplay="None" DataKeyNames="TASK_UID, TASK_PARENT_UID" HierarchyDefaultExpanded="true" HierarchyLoadMode="Client"> <SelfHierarchySettings ParentKeyName="TASK_PARENT_UID" KeyName="TASK_UID" /> <NoRecordsTemplate></NoRecordsTemplate> </MasterTableView> <ClientSettings AllowExpandCollapse="true" /> </telerik:RadGrid>However, as you can see from the screenshot, the columns are not aligning as they are in the demo. The code-behind is exactly as in the demo. The only difference is that I am running on .Net 3.5
Entire code behind code is here:
protected void Page_Load(object sender, EventArgs e) { rgTasks.MasterTableView.FilterExpression = "TASK_PARENT_UID IS NULL"; } protected void RadGrid1_ColumnCreated(object sender, GridColumnCreatedEventArgs e) { if (e.Column is GridExpandColumn) { e.Column.Visible = false; } else if (e.Column is GridBoundColumn) { e.Column.HeaderStyle.Width = Unit.Pixel(100); e.Column.ItemStyle.Wrap = false; } } public void Page_PreRender(object sender, EventArgs e) { HideExpandColumnRecursive(rgTasks.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, "TASK_UID"); if (e.Item is GridHeaderItem && e.Item.OwnerTableView != rgTasks.MasterTableView) { e.Item.Style["display"] = "none"; } if (e.Item is GridNestedViewItem) { e.Item.Cells[0].Visible = false; } } protected void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e) { CreateExpandCollapseButton(e.Item, "TASK_UID"); } 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 - 1; button.Style["margin-left"] = level * 15 + "px"; TableCell cell = ((GridDataItem)item)[columnUniqueName]; cell.Controls.Add(button); cell.Controls.Add(new LiteralControl(" ")); 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"; }