Hierarchical RadGridView options for displaying one to many child templates

1 Answer 29 Views
GridView
Julian
Top achievements
Rank 1
Iron
Iron
Iron
Julian asked on 13 Jun 2025, 01:10 PM

Hi

I have a RadGridView populated from a DataSet that has one MasterTemplate and two child templates which is working fine.

The rows from the two child templates are displayed in a RadPageView element in tabs - which has different modes to display I have learnt.

But I want to have all the rows from both child templates displayed one under the other - without having to click through the categories and without headers.

Is that possible?

1 Answer, 1 is accepted

Sort by
1
Nadya | Tech Support Engineer
Telerik team
answered on 16 Jun 2025, 11:07 AM

Hello, Julian,

Following the provided information, I suppose you have two child templates that contain different data and columns. Can you confirm this?

Yes, rows from the two child templates are displayed in tabs represented by RadPageView and may have different modes to display, eg. Strip, Stack, Outlook, ExplorerBar. We have a KB article that shows how to display all rows from both child templates, one under the other,r without using tabs. You can achieve this by customizing the hierarchy view of the RadGridView. Please refer to How to Change PageViewMode for the Nested Levels in RadGridView

As to hiding the child templates' headers, see the following example: Hiding Child Tabs when no Data is Available.

This approach should help you display all rows from the child templates in a stacked manner without headers. If you need further assistance or customization, please let me know.

Regards,
Nadya | Tech Support Engineer
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Julian
Top achievements
Rank 1
Iron
Iron
Iron
commented on 19 Jun 2025, 08:37 AM | edited

Yes, I have two child templates with different data, by chance they have identical colmuns

Thank you for your two examples, it is indeed what I was looking for.

I assume that you advise me to use the ExplorerBar PageViewMode, and actually I wasn't aware that it is what I was aiming at.

But unfortunately the second example you provided does only work for the standard PageViewMode.  With the ExplorerBar PageVieMode the rows of all but one of the tabs get deleted.

Julian
Top achievements
Rank 1
Iron
Iron
Iron
commented on 19 Jun 2025, 11:59 AM

I think it would be good to know how to hide the headers of the tabs of the PageView without hiding the rows.

In ExplorerBar PageViewMode I would then have what I want: all rows without any headers

Nadya | Tech Support Engineer
Telerik team
commented on 19 Jun 2025, 12:37 PM

Hello, Julian,

I am glad that the provided examples were useful for you to achieve your grid setup. 

Yes, you can hide the headers of the tabs for the RadPageView when using the ExplorerBar mode. To do so, you need to handle the ViewCellFormatting and access the RadPageViewExplorerBarElement.

Please refer to the following code snippet:

 private void RadGridView1_ViewCellFormatting(object sender, CellFormattingEventArgs e)
 {
     GridDetailViewCellElement cellElement = e.CellElement as GridDetailViewCellElement;
     if (cellElement != null)
     {
         RadPageViewExplorerBarElement explorerBarElement = cellElement.PageViewElement as RadPageViewExplorerBarElement;
         if (explorerBarElement != null)
         {
            explorerBarElement.Header.Visibility = ElementVisibility.Collapsed; 
         }
     }
 }

I hope this helps. If you have other questions, do not hesitate to contact me.

Regards,
Nadya

Julian
Top achievements
Rank 1
Iron
Iron
Iron
commented on 19 Jun 2025, 12:46 PM

Unfortunately that only hides the topmost header, but not the headers of the tabs/pages
Nadya | Tech Support Engineer
Telerik team
commented on 19 Jun 2025, 01:11 PM

Hello, Julian,

Here is how you can hide the headers of each tab/page. In my opinion, in such a case when no title is presented for the separate page, it may get confusing to the clients what exactly is presented in the grid. However, I am not familiar with your exact design but if this is what you are trying to achieve, please use the following code snippet:

private void RadGridView1_ViewCellFormatting(object sender, CellFormattingEventArgs e)
{
    GridDetailViewCellElement cellElement = e.CellElement as GridDetailViewCellElement;
    if (cellElement != null)
    {
        RadPageViewExplorerBarElement explorerBarElement = cellElement.PageViewElement as RadPageViewExplorerBarElement;
        if (explorerBarElement != null)
        {
            explorerBarElement.Header.Visibility = ElementVisibility.Collapsed;
            foreach (RadPageViewExplorerBarItem item in explorerBarElement.Items)
            {
                if (item != null)
                {
                    item.Visibility = ElementVisibility.Hidden;
                }
            }
        }
    }
}

Regards,
Nadya

Julian
Top achievements
Rank 1
Iron
Iron
Iron
commented on 19 Jun 2025, 01:23 PM

Thank you. It is what I want to achieve because the clients want exactly that, no need for headers

But another but:

With ElementVisibility.Hidden there is still a vast white space instead of the headers. With ElementVisibility.Collapsed the rows are gone as well.

Nadya | Tech Support Engineer
Telerik team
commented on 19 Jun 2025, 01:34 PM

Hello, Julian,

Thank you for clarifying this. To avoid the vast white space reserved for the headers, then you can set the Text property to an empty string as follows (instead of setting  ElementVisibility.Hidden):

if (item != null)
{
    item.Text = "";
}
Julian
Top achievements
Rank 1
Iron
Iron
Iron
commented on 20 Jun 2025, 08:14 AM | edited

Okay, technically you could argue that it solves the issue.

But it looks horrible and therefore wont be a solution that is usable,

The headers are still there only smaller

Nadya | Tech Support Engineer
Telerik team
commented on 20 Jun 2025, 12:28 PM | edited

Hello, Julian, 

With my latest code snippet, I am not able to observe tab headers on my end. Here is the result on my side:

 Maybe there is something different on your side. What comes to my mind is to set RadPageViewExplorerBarItem.DrawText = false; This property will prevent the text from drawing in the item.

 

//ViewCellFormatting
//...
 foreach (RadPageViewExplorerBarItem item in explorerBarElement.Items)
 {
     if (item != null)
     {
         item.DrawText = false;
     }
 }

Can you set the DrawText property and let me know if it remove the headers completely on your side?

Julian
Top achievements
Rank 1
Iron
Iron
Iron
commented on 20 Jun 2025, 12:46 PM

Yes, they are still there - and can still be used to open and close the tabs
Nadya | Tech Support Engineer
Telerik team
commented on 20 Jun 2025, 01:20 PM

Hello, Julian,

Is it possible to open a ticket and provide your project there? I need to investigate why the headers are still there, but without having your exact setup, it would be difficult to determine. When I have the project that shows the problem, I will be able to inspect it more precisely and assist you further.

Regards,
Nadya

Julian
Top achievements
Rank 1
Iron
Iron
Iron
commented on 22 Aug 2025, 06:44 AM | edited

Hi again

In all examples there seems to be no way to access the header of the ExplorerBarItem/PageViewItem. You always set the Visibility of the whole item.

The Collapsed option hides the whole item, header and table. That is what I want to achieve when there is no row in the belonging datasource.  I succeeded there now after realizing your example in the link is flawed because it relies on the views being in a specific order in the collection which they had not in my case.

The Hidden option of the ExplorerBarItem/PageViewItem hides the header but shows the table but also leaves behind unexpected, undesirable spaces, at least in my theme (Windows8). That is also a very strange behaviour

After all, I want to access only the header and set its visibility.

 

Nadya | Tech Support Engineer
Telerik team
commented on 26 Aug 2025, 10:15 AM

Hello, Julian,

RadPageViewExplorerBarItem does not have a header. RadPageViewExplorerBarElement has. I already demonstrated to you how to access the header of RadPageViewExplorerBarElement. Please refer to my post from June 19, 2025, in this thread. This was the first thing that I suggested.

I am posting again the same code snippet here:

private void RadGridView1_ViewCellFormatting(object sender, CellFormattingEventArgs e)
{
    GridDetailViewCellElement cellElement = e.CellElement as GridDetailViewCellElement;
    if (cellElement != null)
    {
        RadPageViewExplorerBarElement explorerBarElement = cellElement.PageViewElement as RadPageViewExplorerBarElement;
        if (explorerBarElement != null)
        {
            explorerBarElement.Header.Visibility = ElementVisibility.Collapsed;
        }
    }
}

However, you replied that this does not help. Then, I suggested several other approaches that you can try, including disable text drawing. All approaches that I suggested are working on my side. It is difficult to guess what exactly is happening on your side, and this is why I requested that to provide me with a sample project.

If the above duscussed suggestions do not help and you need further assistance, it would be necessary to provide me a project and demonstrate what your exact setup is and demonstrate the header you need to collapse. Thus, I should be able to assist you further.

Thank you for your understanding.

Tags
GridView
Asked by
Julian
Top achievements
Rank 1
Iron
Iron
Iron
Answers by
Nadya | Tech Support Engineer
Telerik team
Share this question
or