Telerik Forums / UI for ASP.NET AJAX
This is a migrated thread and some comments may be shown as answers.

hide group expand collapse columns in RadGrid

11 Answers 1186 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Karl
Top achievements
Rank 1
Karl asked on 28 Oct 2010, 05:02 PM
example.png
I have a grid which has 7 fixed width columns and I have enabled the ability to group these. However when I add a grouping by dragging the column to the Group header row, additional columns are added at the beginning of my grid, pushing my grid and data out to the right.

Id like to be able to prevent these columns from being added and just the group headers be shown as additional rows, either with or without the ability to expand or collapse.

I have attached an image of what is happening. The red section highlights the newly added column when I group, and the green section highlights the grid and its data being forced out to the right.

I have to set the width of the rows or they all come out the same size making the header row twice as tall as I want it. If there is an easy way to have the entire grid set to a width and the columns size automatically then please tell me how.

11 Answers, 1 is accepted

Sort by
0
Dimo
Telerik team
answered on 02 Nov 2010, 10:28 AM
Hi Karl,

The group splitter column has not been designed to be easily hidden, but you can use the approach shown below.

When you use scrolling with static headers and at least one column has explicit width (in this case - the GroupSplitterColumn), then the TableLayout is automatically switched to Fixed. This means that all columns with no explicit width will become equally wide. Removing the group column's width is hardly an option, as it will become too wide.


<%@ Page Language="C#" %>
<%@ Import Namespace="System.Data" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
 
<script runat="server">
 
    protected void RadGrid_NeedDataSource(object sender, GridNeedDataSourceEventArgs e)
    {
        DataTable dt = new DataTable();
        DataRow dr;
        int colsNum = 4;
        int rowsNum = 4;
        string colName = "Column";
 
        for (int j = 1; j <= colsNum; j++)
        {
            dt.Columns.Add(String.Format("{0}{1}", colName, j));
        }
 
        for (int i = 1; i <= rowsNum; i++)
        {
            dr = dt.NewRow();
 
            for (int k = 1; k <= colsNum; k++)
            {
                dr[String.Format("{0}{1}", colName, k)] = String.Format("{0}{1} Row{2}", colName, k, i);
            }
            dt.Rows.Add(dr);
        }
 
        (sender as RadGrid).DataSource = dt;
    }
 
    protected void RadGrid1_ColumnCreated(object sender, GridColumnCreatedEventArgs e)
    {
        if (e.Column is GridGroupSplitterColumn)
        {
            e.Column.HeaderStyle.Width = Unit.Pixel(1);
        }
    }
     
</script>
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 
<head runat="server">
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<title>RadControls</title>
<style type="text/css">
 
.rgGroupCol
{
    padding-left: 0 !important;
    padding-right: 0 !important;
    font-size:1px !important;
}
 
.rgExpand,
.rgCollapse
{
    display:none !important;
}
 
</style>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
 
<telerik:RadGrid
    ID="RadGrid1"
    runat="server"
    Width="800px"
    Skin="Hay"
    GroupingEnabled="true"
    ShowGroupPanel="true"
    OnNeedDataSource="RadGrid_NeedDataSource" OnColumnCreated="RadGrid1_ColumnCreated">
    <ClientSettings AllowDragToGroup="true" />
</telerik:RadGrid>
 
</form>
</body>
</html>


Greetings,
Dimo
the Telerik team
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 Public Issue Tracking system and vote to affect the priority of the items
0
Karl
Top achievements
Rank 1
answered on 30 Nov 2010, 11:44 AM
Awesome.

I couldn't quite get this to work, The column always appeared still, but after having a tinker  (as you'd put me on the right path at least) I ended up with the following...

Instead of
protected void RadGrid1_ColumnCreated(object sender, GridColumnCreatedEventArgs e)
{
    if (e.Column is GridGroupSplitterColumn)
    {
        e.Column.HeaderStyle.Width = Unit.Pixel(1);
    }
}

I ended up with

protected void RadGrid1_ColumnCreated(object sender, GridColumnCreatedEventArgs e)
{
    //Used to set the added group column width
    if (e.Column is GridGroupSplitterColumn)
    {
        e.Column.Visible = false;
    }
}

which hides the columns nicely. Is this a new feature with Q3 2010?

However, I now want to hide the collapse/expand icons that appear at the start of the group header rows... :)

0
Princy
Top achievements
Rank 2
answered on 30 Nov 2010, 12:48 PM
Hello Karl,

Give a try with the following approach to hide the group ExpandCollapse column.

C#:
protected void RadGrid1_ColumnCreated(object sender, GridColumnCreatedEventArgs e)
   {
       if (e.Column is GridGroupSplitterColumn)
       {
          e.Column.Visible = false;
       }
   }
   protected void RadGrid1_ItemCreated(object sender, GridItemEventArgs e)
   {
       if (e.Item is GridGroupHeaderItem)
       {
           (e.Item as GridGroupHeaderItem).Cells[0].Controls.Clear();
       }
   }

Thanks,
Princy.
0
Karl
Top achievements
Rank 1
answered on 30 Nov 2010, 01:04 PM
Hi Princy,

That worked a treat, thank you!

I also added the line

(e.Item

 

as GridGroupHeaderItem).Cells[0].Visible = false;

 


immediately after the line

(e.Item

 

as GridGroupHeaderItem).Cells[0].Controls.Clear();

 


to hide this now empty cell and to pull the grouping text to the left.

now your method reads...

protected void RadGrid1_ItemCreated(object sender, GridItemEventArgs e)
{
    if (e.Item is GridGroupHeaderItem)
    {
        (e.Item as GridGroupHeaderItem).Cells[0].Controls.Clear();
        (e.Item as GridGroupHeaderItem).Cells[0].Visible = false;
    }
}

0
bb
Top achievements
Rank 1
answered on 15 Jan 2011, 12:44 AM
Nothing works for me, the Collapse Group just refuse to go.  Any ideas?  Thanks.
0
Princy
Top achievements
Rank 2
answered on 17 Jan 2011, 12:36 PM
Hello,

The above code is working fine at my end. Please try the following CSS to hide the ExpandCollapseColumn.

CSS:
<style type="text/css">
       .rgCollapse
       {
           display:none !important;
       }
       .rgExpand
       {
          display:none !important;
       }
 </style>

Thanks,
Princy.
0
Kellen
Top achievements
Rank 1
answered on 30 Jun 2011, 10:48 PM
This has been helpful. I've gotten rid of that extra first column that shows up but... now I can't expand or collapse! Maybe this was an understood cost. Is there anyway to maintain the ability to expand and collapse groups and still get rid of that ugly leading column? Thanks!
0
Calvin
Top achievements
Rank 1
answered on 27 Jul 2012, 03:44 PM
This also seems to work:

public void Grid_ColumnCreated(object sender, GridColumnCreatedEventArgs e)
{
    if (e.Column.OrderIndex < 0)
        e.Column.Visible = false;
}


0
NEX
Top achievements
Rank 1
answered on 13 Mar 2014, 04:58 AM
This works for me, thanks!
0
Richard
Top achievements
Rank 1
answered on 19 Aug 2014, 05:22 PM
            MinutesRadGrid.MasterTableView.ExpandCollapseColumn.Visible = false; 

Works for me. But not in the markup..... Not too happy about that as it would be desirable in this instance to be able to put it in the markup .
0
Eyup
Telerik team
answered on 22 Aug 2014, 12:18 PM
Hi Richard,

I'm afraid currently the group expand column can be hidden only on the code-behind.
Please excuse us for any inconvenience this might have caused you.

Regards,
Eyup
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
Tags
Grid
Asked by
Karl
Top achievements
Rank 1
Answers by
Dimo
Telerik team
Karl
Top achievements
Rank 1
Princy
Top achievements
Rank 2
bb
Top achievements
Rank 1
Kellen
Top achievements
Rank 1
Calvin
Top achievements
Rank 1
NEX
Top achievements
Rank 1
Richard
Top achievements
Rank 1
Eyup
Telerik team
Share this question
or