How to add a row in Header of RadGrid

20 posts, 0 answers
  1. Bruce Lam
    Bruce Lam avatar
    23 posts
    Member since:
    Jun 2009

    Posted 17 Nov 2009 Link to this post

    Please help me how to add a row in Header and merge some cells in row of Header

  2. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 17 Nov 2009 Link to this post

    Hello lam,

    You could use GridTemplateColumns to customize your header rows. Here's a help document which explains more on customizing the grid with Templatecolumns using HTML tables in the HeaderTemplate, take a look at it:
    Customizing with GridTemplateColumn

    Thanks
    Princy.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Michael Fuller
    Michael Fuller avatar
    7 posts
    Member since:
    Feb 2010

    Posted 11 Feb 2010 Link to this post

    In my project were unable to use GridTemplateColumns because of the dynamic nature of our grid's data.  How can we add on additional header rows and merge/span column headers by using code behind only?
  5. Pavlina
    Admin
    Pavlina avatar
    6084 posts

    Posted 12 Feb 2010 Link to this post

    Hello Michael,

    I suggest you examine the following code library, which demonstrates how to span any given cell over a number of rows/columns.
    http://www.telerik.com/community/code-library/aspnet-ajax/grid/span-cells-in-grid-over-multiple-positions.aspx

    Sincerely yours,
    Pavlina
    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.
  6. Joe
    Joe avatar
    11 posts
    Member since:
    Sep 2007

    Posted 18 Feb 2010 Link to this post

    When we implement a spanned column header using the following code, all sorting ceases to work.  We've tried to use the override on the master table to get the grid to sort, but no luck.  We've implemented sorting in our object and it still won't sort.   Any ideas.

        protected void SetupDualHeaders(object sender, EventArgs e)  
        {  
            RadGrid _grid = ((RadGrid)sender);  
     
            //get the current header    
            GridItem[] header = _grid.MasterTableView.GetItems(GridItemType.Header);  
            //get the current THead element    
            GridTHead head = ((GridTHead)header[0].Parent.Controls[1].Parent);  
            //Get the GridHeaderItem from the THead    
            GridCommandItem _currentHeaderCommand = (GridCommandItem)head.Controls[0];  
            GridHeaderItem currentHeaderItem = (GridHeaderItem)head.Controls[1];  
            //Clear all GridHeaderItems    
            head.Controls.Clear();  
            //create a new GridHeaderItem which will be the new row    
            GridHeaderItem newnewHeaderItem = new GridHeaderItem(_grid.MasterTableView, 0, 0);  
     
            newHeaderItem.Cells.Add(new GridTableHeaderCell() { Text = " " });  
            newHeaderItem.Cells.Add(new GridTableHeaderCell() { Text = " " });  
            newHeaderItem.Cells.Add(new GridTableHeaderCell() { Text = " "ColumnSpan = 3HorizontalAlignHorizontalAlign = HorizontalAlign.Center });  
            newHeaderItem.Cells.Add(new GridTableHeaderCell() { Text = "Reg Code"ColumnSpan = 2HorizontalAlignHorizontalAlign = HorizontalAlign.Center });  
            newHeaderItem.Cells.Add(new GridTableHeaderCell() { Text = "Actual"ColumnSpan = 7HorizontalAlignHorizontalAlign = HorizontalAlign.Center });  
     
     
            head.Controls.Add(_currentHeaderCommand);  
            head.Controls.Add(newHeaderItem);  
            head.Controls.Add(currentHeaderItem);  
        } 
  7. Pavlina
    Admin
    Pavlina avatar
    6084 posts

    Posted 24 Feb 2010 Link to this post

    Hello,

    The following code library presents how to perform individual sorting and filtering for sub-columns in template column (with multi-header appearance):
    Individual filtering and sorting for "sub-columns" in template column

    Greetings,
    Pavlina
    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.
  8. Joe
    Joe avatar
    11 posts
    Member since:
    Sep 2007

    Posted 24 Feb 2010 Link to this post

    That's rather complex (as I then have to implement a double hit against the database or the object).  Here's what we wound up doing instead last week.  In the original example provided, the headers were cleared.  Well this not only causes sorting to break, but will also clear out the command item and the filter rows - so it's not really a good thing.   Instead we looped through the header collection found the correct GrideHeader Item (vs the command item or the filter item) and inserted a row above it. This will let your sorting, filtering, etc work without any significant code.   Make sure this is fired as the Grid PreRender Event. Here's the code.

        protected void SetupDualHeaders(object sender, EventArgs e)  
        {  
            RadGrid _grid = ((RadGrid)sender);  
     
            //get the current header    
            GridItem[] header = _grid.MasterTableView.GetItems(GridItemType.Header);  
            //get the current THead element    
            GridTHead head = ((GridTHead)header[0].Parent.Controls[1].Parent);  
       
     
     
            GridHeaderItem newHeaderItem = new GridHeaderItem(_grid.MasterTableView, 0, 0);  
            newHeaderItem.Cells.Add(new GridTableHeaderCell() { Text = " " });  
            newHeaderItem.Cells.Add(new GridTableHeaderCell() { Text = " " });  
            newHeaderItem.Cells.Add(new GridTableHeaderCell() { Text = " "ColumnSpan = 3HorizontalAlign = HorizontalAlign.Center });  
            newHeaderItem.Cells.Add(new GridTableHeaderCell() { Text = "Reg Code"ColumnSpan = 2HorizontalAlign = HorizontalAlign.Center });  
            newHeaderItem.Cells.Add(new GridTableHeaderCell() { Text = "Actual"ColumnSpan = 7HorizontalAlign = HorizontalAlign.Center });  
     
     
            for (int i = 0; i < head.Controls.Count; i++)  
            {  
                // loop through the header controls collection and find the 'row' that has the same type of GridHeaderItem
                // Then insert the new row just above it - remember the 0 based index will push the original header row down
                if (head.Controls[i].GetType() == newHeaderItem.GetType())  
                {  
                    head.Controls.AddAt(i, newHeaderItem);  
                }  
     
            }  
        } 
  9. Pavlina
    Admin
    Pavlina avatar
    6084 posts

    Posted 01 Mar 2010 Link to this post

    Hello Joe,

    Thank you for sharing your solution found with the community. I am sure it would be helpful for the people which are searching a similar functionality.

    Regards,
    Pavlina
    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.
  10. First
    First avatar
    19 posts
    Member since:
    Jun 2009

    Posted 03 May 2010 Link to this post

    Great! Thanks Joe. Your solution is very helpful and elegant I would say.
    Sometimes you just get unsual requests from the users.
    My user wants the footer to be on top of the grid. I've been searching high and low, but I couldn't find a good solution to it.
    And this is just great. 
    http://www.telerik.com/community/forums/aspnet-ajax/grid/footer-position.aspx

    You have scored a gold point!

    Sxin
  11. OPL
    OPL avatar
    25 posts
    Member since:
    Jul 2010

    Posted 06 Jan 2011 Link to this post

    Hi,
    I tried to use Joe sample (thks. Joe).

    It works great but i encountered some troubles when using filtering with hierarchical or radajax call.

    My original header is copy in the fitering row.

    Thanks.

    OPL
  12. Pavlina
    Admin
    Pavlina avatar
    6084 posts

    Posted 07 Jan 2011 Link to this post

    Hello Jérôme,

    As the provided information is not enough for us to replicate the issue locally, I will ask you to open a regular support ticket and send us small runnable application which demonstrates the problem. We will test it locally and advise you further.

    Thank you!

    Best wishes,
    Pavlina
    the Telerik team
    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
  13. Megan Vee
    Megan Vee avatar
    40 posts
    Member since:
    Mar 2010

    Posted 11 Jan 2011 Link to this post

    How do you make the different header rows have different formatting? 
    Can someone provide an example?
    Mine are both defaulting to the skin and I can't seem to change it. 
    Please help.
    Thank you.
    -M
  14. Pavlina
    Admin
    Pavlina avatar
    6084 posts

    Posted 14 Jan 2011 Link to this post

    Hi Bruce Lam,

    To achieve the desired functionality you could try overriding the css classes of the RadGrid headers. Refer to the following online article for more information about the RadGrid skin css classes:
    http://www.telerik.com/help/aspnet-ajax/grdcreatingnewskins.html

    All the best,
    Pavlina
    the Telerik team
    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
  15. Karrie
    Karrie avatar
    12 posts
    Member since:
    Feb 2013

    Posted 04 Apr 2013 Link to this post

    Telerik's Q1 2013 release of ColumnGroups and ColumnGroupName for RadGrid
    may help some people in this thread.  Here's the demo :  

    Grid - Multi-Column Headers

  16. RJ
    RJ avatar
    386 posts
    Member since:
    Oct 2006

    Posted 17 Feb in reply to Karrie Link to this post

    How about dynamic Multi-Column Headers in codebehind
  17. Pavlina
    Admin
    Pavlina avatar
    6084 posts

    Posted 22 Feb Link to this post

    Hi,

    If you want dynamic multi-column headers you need to create the entire grid in the Page_Load or Page_Init event as shown in the help article below. Note that it is not supported to create columns in the aspx definition and multi column headers in the code behind for the same grid.
    http://docs.telerik.com/devtools/aspnet-ajax/controls/grid/defining-structure/creating-a-radgrid-programmatically

    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
  18. RJ
    RJ avatar
    386 posts
    Member since:
    Oct 2006

    Posted 24 Feb Link to this post

    Hi Pavlina,

    Can you please post snippet sample of just two column using code behind. 1st column normal header (e.g Record Number). 2nd column multi column header (e.g. Client Name. which has 2 column First Name and Last Name). 

    Thanks in advance,

    RJ

  19. Pavlina
    Admin
    Pavlina avatar
    6084 posts

    Posted 29 Feb Link to this post

    Hello,

    You can try using the code snippet below in order to add multi-column headers dynamically:

    protected void Page_Load(object sender, EventArgs e)
            {
                if (!IsPostBack)
     
                {
     
                    RadGrid1.AllowFilteringByColumn = false;
     
                    RadGrid1.AllowSorting = true;
     
                    RadGrid1.AutoGenerateColumns = false;
     
                    RadGrid1.AllowPaging = true;
     
                    RadGrid1.PreRender += RadGrid1_PreRender;
     
                    RadGrid1.NeedDataSource += RadGrid1_NeedDataSource;
     
                    RadGrid1.ClientSettings.Scrolling.AllowScroll = false;
     
                    RadGrid1.ClientSettings.Scrolling.UseStaticHeaders = true;
     
                    RadGrid1.PagerStyle.Position = GridPagerPosition.TopAndBottom;
     
                    RadGrid1.PagerStyle.Mode = GridPagerMode.NumericPages;
     
                    foreach (Group group in Groups)
     
                    {
     
                        GridColumnGroup gridGroup = new GridColumnGroup();
     
       
     
                        RadGrid1.MasterTableView.ColumnGroups.Add(gridGroup);
     
       
     
                        gridGroup.Name = group.Name;
     
                        gridGroup.HeaderText = group.Name;
     
                        foreach (GroupItem item in group.Items)
     
                        {
     
                            GroupItem dataItem = item;
     
                            GridColumn col =
     
                                RadGrid1.MasterTableView.AutoGeneratedColumns.First(c => c.UniqueName == dataItem.DataName);
     
                            col.ColumnGroupName = group.Name;
     
                            col.HeaderText = item.ColumnHeading;
     
                        }
     
                    }
     
                }
     
            }

    You should also add grid columns manually on Page_Load.

    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
  20. RJ
    RJ avatar
    386 posts
    Member since:
    Oct 2006

    Posted 28 Jul in reply to Pavlina Link to this post

    Hi Pavlina,

    Thanks for the snippets but I wasn't able to make it work. How were you able to populate Groups? Currently my groups is based on checked items on dropdown, which I made it as an object. Each checked items has 2 items of status and notes. When view grid button is clicked, checked items will be saved in the database and return datasource with columns Task1, Task1Status, Task1Notes, Task3, Task3Status, Task3Notes. Assuming that Task1 and Task3 are the items that's been checked on the combo checkbox.

    I'm having issue with this lines: BTW I'm using vb code.

    RadGrid1.PreRender += RadGrid1_PreRender
    RadGrid1.NeedDataSource += RadGrid1_NeedDataSource

    RadGrid1.MasterTableView.AutoGeneratedColumns.First(c => c.UniqueName == dataItem.DataName);

    AutoGeneratedColumns.First is not recognize so replaced it AutoGeneratedColumns.Find but I cannot find documentation on how to use it.

    I just need to get the column so that I could set its group, or maybe a working sample perhaps in vb.

     

    Thanks again,

    RJ

     

     

     

     

  21. RJ
    RJ avatar
    386 posts
    Member since:
    Oct 2006

    Posted 30 Nov Link to this post

    Any updates?

    ;(

Back to Top
UI for ASP.NET Ajax is Ready for VS 2017