[Solved] GridView Scrollbar Not Appearing With Dynamic Template

[Barry]

I have a GridViewthat is inside of a tab control that is inside of a row details on another GridView. When I autogenerate columns in this inner GridView, the GridView's internal horizontal scrollbar appears as expected. But when I try to dynamically set the template for the GridView, even using StaticResource, the scrollbar is nowhere to be found.

<ControlTemplate x:Key="GridViewTemplate" TargetType="telerik:RadGridView">
  <telerik:RadGridView Name="RadGridView1"
                HorizontalAlignment="{TemplateBinding HorizontalAlignment}"
                VerticalAlignment="{TemplateBinding VerticalAlignment}"
                AutoGenerateColumns="{TemplateBinding AutoGenerateColumns}"
                IsReadOnly="{TemplateBinding IsReadOnly}"
                ItemsSource="{TemplateBinding ItemsSource}"
                RowIndicatorVisibility="{TemplateBinding RowIndicatorVisibility}"
                SelectedItem="{TemplateBinding SelectedItem}"
                ShowGroupPanel="{TemplateBinding ShowGroupPanel}"
                ShowInsertRow="{TemplateBinding ShowInsertRow}">
    <telerik:RadGridView.Columns>
      <telerik:GridViewDataColumn Width="300"
                         Header="Char"
                         IsFilterable="True"
                         IsSortable="True" />
    </telerik:RadGridView.Columns>
  </telerik:RadGridView>
</ControlTemplate>

<telerik:RadGridView Width="800"
              Height="600"
              HorizontalAlignment="Center"
              VerticalAlignment="Center"
              AutoGenerateColumns="True"
              ItemsSource="{Binding Items}"
              ShowGroupPanel="False">
  <telerik:RadGridView.Columns>
    <telerik:GridViewToggleRowDetailsColumn ExpandMode="Single" />
  </telerik:RadGridView.Columns>
  <telerik:RadGridView.RowDetailsTemplate>
    <DataTemplate>
      <telerik:RadTabControl>
        <telerik:RadTabItem Header="Where is my scrollbar?">
          <telerik:RadGridView Height="200"
                        Margin="10"
                        AutoGenerateColumns="False"
                        ItemsSource="{Binding}"
                        ShowGroupPanel="False"
                        Template="{StaticResource GridViewTemplate}" />
        </telerik:RadTabItem>
      </telerik:RadTabControl>
    </DataTemplate>
  </telerik:RadGridView.RowDetailsTemplate>
</telerik:RadGridView>

I thought this issue might be the tab control's fault, so I switched to the tab control that is in the SDK, but it produced the same results. How do I get the internal scrollbar to appear with while setting a template?

You can see the difference here: No Template VS Template

[Yoan]

Hi Barry,

The problem comes from the fact that you have GridView in other GridView when you are using such ControlTemplate. Actually, this is not a good approach. Could you please describe in more details what exactly you want to achieve?

Regards,
Yoan
the Telerik team

[Barry]

Why is this not a good approach?

I want to be able to change the template of a nested GridView so I can have different column definitions depending on the data that the user wants to see in that GridView. It works just fine when it is done in a GridView that is not nested, why doesn't it work with one that is?

[Yoan]

Hello,

You can use Hierarchical GridView instead of GridView in other GridView. In order to have a template of a nested GridView, you can use the HierarchyChildTemplateSelector. For more information please check this online demo where you can find how to use it. I would also suggest you to check this help article which shows how to use the CellTemplateSelector. Actually, the approach is almost the same.

 If you find any difficulties don't hesitate to contact us.


Kind regards,

Yoan
the Telerik team

[Barry]

The example of the HierarchyChildTemplateSelector that you provided only seems to put different templates on different GridViews that are within the row details based on data within the upper GridView, I need to change the template on the SAME GridView based on something outside of the GridView - which is the reason for binding a template in the view model, which is what I do. The example doesn't show the binding of a template... it was just a simple demonstration to illustrate how the scrollbar doesn't appear when you apply a template to a nested GridView.

CellTemplateSelector doesn't seem like it will work for me, I don't want to change the cells of a GridView, I want to change all of the columns.

What I need is:
GridView in row details has 4 columns --> user chooses a selection in a combo box outside of the GridView --> GridView changes those columns and now has 6 different columns.

[Barry]

Ok, so I got the template selector to work, but it only works once. It only sets the template when the child table is opened for the first time. I need it to change templates based on what a user wants to see in the GridView that is currently open... so it needs to change after it has been loaded. How can I get the template to change on a GridView that is loaded?

I also need only one child table available at a time. With row details it has the ability to only allow one to be open at a time, I need that functionality. When one child table is in view I need all others to be hidden. How can I do this?


The below example doesn't help. I need to be able to BIND the template so I can switch it out in the view model.

[Yoan]

Hi Barry,

 As i mentioned in my previous post it is not good approach because you use GridView with other GridView in it which have template with TargetType="telerik:RadGridView". The thing that you can do is to set content template of your tab item. In this template you can define GridView. For your convenience I have attached a sample project based on your code and now there is now problem with the scrollbar.

All the best,
Yoan
the Telerik team