Merging of header in radgridview

[rajeev kumar]

I want to merge header of column in radgridview.For example: 'Name' is header group, under which 3 headers 'First Name', 'Middle Name' and 'Last Name' are available. We are able to merge and group headers using header style and datatemplate for header. But, by using this, it lost all gridview functinality like I am not able to do filtering or sorting on column under header 'First Name' or 'last Name' etc. Please help me to resolve this issue. It is urgent.

[Pavel Pavlov]

Hello rajeev kumar,

This feature is not yeat internally supported by RadGridView. However there are different workarrounds.
In the attached example a common header is rendered above the normal headers thus preserving the sorting and filtering functions of the grid.

Kind regards,
Pavel Pavlov
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.

[bhaskar]

Hi Pavel Pavlov ,
 
Thanks for the post.I also have the same requirement with telerik asp.net ajax radgrid.Could you please provide the solution for this.really urgent.with out missing any grid functionality need to merge the columns.

Thanks in Advance,
Bhaskar.  

I have tried but all the grid functionality is not working properly.please have a look into the code.

public void RadGrid1_ItemCreated(object sender, GridItemEventArgs e)
        {
            if (e.Item.ItemType == GridItemType.Header)
            {
                RadGrid RadGrid1 = (RadGrid)sender;
                GridHeaderItem headerRow = new GridHeaderItem(RadGrid1.MasterTableView, 0, 0);

                // Extra Cell added at the Beginning
                GridTableHeaderCell headerCell = new GridTableHeaderCell();
                headerCell.HorizontalAlign = HorizontalAlign.Center;
                headerCell.Text = " ";
                headerRow.Cells.Add(headerCell);

                // Extra Cell added at the Beginning
                headerCell = new GridTableHeaderCell();
                headerCell.Text = " ";
                headerRow.Cells.Add(headerCell);

                //// First grouping
                //headerCell = new GridTableHeaderCell();
                //headerCell.HorizontalAlign = HorizontalAlign.Center;
                //headerCell.Text = e.Item.Cells[2].Text; // Removing extra cell
                //headerCell.RowSpan = 2;
                //headerRow.Cells.Add(headerCell);
                //e.Item.Cells.RemoveAt(2);
            
                    headerCell = new GridTableHeaderCell();
                    headerCell.HorizontalAlign = HorizontalAlign.Center;
                    headerCell.Text = "";
                    headerCell.ColumnSpan = 1;
                    headerRow.Cells.Add(headerCell);

                    headerCell = new GridTableHeaderCell();
                    headerCell.HorizontalAlign = HorizontalAlign.Center;
                    headerCell.Text = "";
                    headerCell.ColumnSpan = 1;
                    headerRow.Cells.Add(headerCell);

                    headerCell = new GridTableHeaderCell();
                    headerCell.HorizontalAlign = HorizontalAlign.Center;
                    headerCell.Text = "Basecase";
                    headerCell.ColumnSpan = 1;
                    headerRow.Cells.Add(headerCell);

                    headerCell = new GridTableHeaderCell();
                    headerCell.HorizontalAlign = HorizontalAlign.Center;
                    headerCell.Text = "Case1";
                    headerCell.ColumnSpan =1;
                    headerRow.Cells.Add(headerCell);
               
                GridTHead gridTHead = e.Item.Parent as GridTHead;
                if (gridTHead != null)
                {
                    // Adding the header row to group columns.
                    gridTHead.Controls.AddAt(0, headerRow);
                }
              
            }
        }

 

[Vlad]

Hi,

This forum is for our WPF grid - you can post your questions in the relevant forum!

Sincerely yours,
Vlad
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.

[rajeev kumar]

Hi Pavel Pavlov,
        Thanks for your solution. I am able to achieve the grouping functionality. I am facing one problem >
I have one more column header 'Conatct No.'  that does not belong to group column header 'Name'. I do not want to move that column inside the group column header 'Name'. Even I do not want to move column under header 'Name' to move out of group.But we can move columns under one header group like 'First Name', 'Middle Name' and 'Last Name' column order . How to do solve this problem. Please give some solution.

Regards,
Rajeev

[Pavel Pavlov]

Hello rajeev kumar,

I have provided an updated sample ( with the latest version of RadGridview) . I believe it gives more power and control over column grouping . You may find it helpful.

You may find the article here http://blogs.telerik.com/pavelpavlov/posts/09-12-04/adding_additional_power_to_radgridview_for_silverlight_with_attached_behaviors.aspx

Best wishes,
Pavel Pavlov
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.

[rajeev kumar]

Hi Pavel,
            I have seen ur sample. Thanks for ur response. But, I want the reordering functionality also. So, I am following ur first sample. But, I am facing one problem. I have two group header:- 'Office Address' and 'Home Address' . I want the background color or font color of these two header should be different.How to set this. I am not able set different style for these two header.Can u please give some solution to this. Thanks in advance.


Regards,
Rajeev
          

[Pavel Pavlov]

Hi rajeev kumar,

The attached example demonstrates how you can change the background of a common header.
This is generally the project from my blog with a few changes.
The changed files are MainPage.cs and CommonHeader.cs

Let me know if you find troubles adapting this to your project.

Kind regards,
Pavel Pavlov
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.

[rajeev kumar]

Hi Pavel,
        Thank you for ur response. I have tried ur solution, but u r hiding the column header. But, I want column header also to be displayed below group header.(columngroups2.zip as in this solution).So, please give some suggestion.

Regards,
Rajeev

[Pavel Pavlov]

Hello rajeev kumar,

I am a bit confused.There seems to be a kind of misunderstanding. I definitely do not hide the column headers. Please see the image attached.
Column headers are there ( marked with the text "regular column headers").

Kind regards,
Pavel Pavlov
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.

[rajeev kumar]

Hi Pavel,
        Thank you for ur response. I have tried ur solution, it is working fine for silverlight. But when I tried to convert it into WPF, I am not able to see the column header. Can you please give that solution for WPF. I have used same way whatever u have used. I have tried to attach .zip file of solution for ur reference purpose, but not able to attach. Please give some suggestion.

Regards,
Rajeev

[rajeev kumar]

Hi Pavel,
        Thank you for ur response. I have tried ur solution, it is working fine for silverlight. But when I tried to convert it into WPF, I am not able to see the column header.Actaully column header got overlap by group header.How to overcome this problem.Please suggest.Even I think that grid functionality are missing (like sorting, grouping,filtering). Please give some suggestion.
Regards,
 Rajeev

[Pavel Pavlov]

Hi rajeev kumar,

I am sending attached the example from the blog , converterd to WPF.  I believe everything is working OK - no overlapping, no missing functionallity as filtering or sorting .

Let me know if you need further assistance.

Sincerely yours,
Pavel Pavlov
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.

[rajeev kumar]

 

Hi Pavel,
        Thank you for ur response. I have tried ur solution, it is working fine.But if I am putting Background="Green" for CommonHeader tag in "Window1.xaml", then also the background color of group header is not changing to green. I do not know the cause behind that. Please see and give some solution.
Regards,
 Rajeev

[rajesh singh]

Hi Pavel ,

          I  also have same kind of requirement, what rajeev has. I have implemented ur solution. I am also getting same problem as Rajeev. I am not able to change the background color by putting Background="Green" for CommonHeader tag in "Window1.xaml" file whatever u have shared. Is some where it got overriden. Can u also try and let me know, is it working for u or not. If not, then let me know.
Thanks u in advance.
Rajesh.

[rajeev kumar]

Hi Pavel,
            The solution columnheadergroups-wpf.zip u have provided is working fine, but the grid is not supporting drag and drop of columns functionality( reordering of columns). I am not able to reorder the column. Can u please give some solution. Thanks in advance.

Regards,
Rajeev Kumar

[Eduan Marais]

Thanks for the WPF Example.

I modified it a bit, as I needed to create the Common Headers in runtime, based on values passed through a dataset.
I do experience a problem though.

The Common headers does not show until you clicked on the Filter on a column and selected SELECT ALL. ??

I think because you are adding the Common Columns in your xaml, you do not have this issue.
Is there some property that I need to set to show the Common columns straight away?

I think one way to bypass the issue is to fire the FILTERED event manually, but I do not know how... ? :-(

Please assist if possible.

Thx
Eduan

[Pavel Pavlov]

Hello Eduan Marais,

Let me see your code . This way I can find what is causing the trouble and provide the modifications necessary.
 An alternative is to send me your project and let me fix it for you . To be able to attach it , you will need to open a support ticket.

Best wishes,
Pavel Pavlov
the Telerik team

[Eduan Marais]

HI Pavel,

I have created a support ticket, ref no 325987.
I have attached the enitre project. Please ignore all the logic irrellevant to the issue.

Thanks, looking forward to your reply

Eduan

[Pavel Pavlov]

Hello Eduan Marais,
As mentioned in the support relevant support ticket ,
the solution is to modify the code in ColumnGroupsBehaviour.cs
as following:
1. Remove the hadling of the DataLoaded event

2. Substitute it  the following way:

protected override void OnAttached()
      {
          base.OnAttached();
          var grid = this.AssociatedObject.ChildrenOfType<Grid>().Where(c => c.Name == "HierrarchyBackground").FirstOrDefault();
          if (grid != null)
              PlaceSecondaryHeader();
          this.AssociatedObject.LayoutUpdated += new EventHandler(AssociatedObject_LayoutUpdated);
      }
      void AssociatedObject_LayoutUpdated(object sender, EventArgs e)
      {
          var grid = this.AssociatedObject.ChildrenOfType<Grid>().Where(c => c.Name == "HierrarchyBackground").FirstOrDefault();
          if (grid != null)
          {
              this.AssociatedObject.LayoutUpdated -= new EventHandler(AssociatedObject_LayoutUpdated);
              PlaceSecondaryHeader();
          }
      }

Best wishes,
Pavel Pavlov
the Telerik team

[Siva Prakash]

Hi,

I have a requirement some what like this.

----------------------------------------------------------------------------
|      Coordinates |                     |                    |                        |
|---------------------|    Width (m)  |   Height(m) |  Efficienty (%)  |
|    X(m) |   Y(m)   |                     |                   |                         |
----------------------------------------------------------------------------
Is this type of header column merging feature possible ?
I got the latest Q3 Telerik WPF 4.0 dll's.  In that one header column merging feature was introudced. But its not serving me this type of functionality. Its showing somewhat like this.

----------------------------------------------------------------------------
|      Coordinates |                     |                    |                        |
|---------------------| ----------------|----------------|-------------------|
|    X(m) |   Y(m)   |   Width (m)   |  Height(m)  | Efficienty (%)  |
----------------------------------------------------------------------------

So please help me out in implementing this.

Thanks & Regards
K Siva Prakash.

[Black]

Hello,

I have to use your solution because my client doesn't want to upgrade telerik to have the new option for grouping headers.

Your solution works very well, but I have a problem.

I need to bind the text on the Caption, and It doesn't work...

<telerik:RadGridView Grid.Column="2" AutoGenerateColumns="False" ShowGroupPanel="False" IsSynchronizedWithCurrentItem="True" IsReadOnly="True" ItemsSource="{Binding MyListe}" Height="750" CanUserDeleteRows="False" Margin="10,10,20,20" ScrollViewer.VerticalScrollBarVisibility="Auto">
                    <i:Interaction.Behaviors>
                        <local:ColumnGroupsBehavior>
                            <local:ColumnGroupsBehavior.CommonHeaders>
                                <local:UserControlCommonHeader StartColumnIndex="0" Caption="{Binding CurrentTranslation[lbl_cars]}" ColumnSpan="4" />
                                <local:UserControlCommonHeader StartColumnIndex="4" Caption="train" ColumnSpan="2" />
                                <local:UserControlCommonHeader StartColumnIndex="6" Caption="plane"  ColumnSpan="6" />
                            </local:ColumnGroupsBehavior.CommonHeaders>
                        </local:ColumnGroupsBehavior>
                    </i:Interaction.Behaviors>
</telerik:RadGridView>

How can I do that??

I have an other problem, I want to set the property RowIndicatorVisibility="Collapsed" in the gridview but the top header keep this, and so columns are not well design.

Thanks a lot...