How to propagate the operations done on Parent grid view to child grid view?

[Vivek]

I have a parent grid which has a child RadGridView in the HierarchyChildTemplate. And i have the same columns for both parent and children rows. I want to apply all the operations that are done on the parent to be propagated to children, like when i resize the parent column i want the corresponding column in child also to be resized and when i reorder the column of the parent, i want the children columns also to be reordered and when i move the FrozenColumns bar to some columns in parent, i want the child grid also to Freeze the same number of columns etc. In short, i want the control to behave the same way as RadTreeListView for hierarchy. I found that i can use events ColumnWidthChanged, ColumnReordered for resize and reorder, but i didn't find any event for change of FrozenColumns. 

And do i need to rewrite all my triggers and behaviors present on the parent Grid in the Child Grid to apply on the child? Or is there any way to propagate all the operations done on parent columns automatically to children? If no, do you have a sample template to propagate all the changes made on the parent columns to the child grid?

[Dimitrina]

Hello,

In order to have synchronization between the width of the columns in the parent GridView and the Row Details, you can try Binding the Width of the respective columns in both the Parent and Child grid to a property in your ViewMode.

For example:

<telerik:GridViewDataColumn DataMemberBinding="{Binding Name}" Width="{Binding Width1, Mode=TwoWay, Source={StaticResource MyViewModel}}"/>

 

This code should synchronize the column' s width.

You can try the same approach with the FrozenColumnCount property. 

I am afraid there are no options RadGridView exposes allowing such a full synchronization to be accomplished. Therefore I cannot suggest a good approach to achieve your request.

Regards,
Didie
Telerik

 

 

[Vivek]

Thanks for the suggestion. I'm trying what has been suggested. Meanwhile i found one more thing that even if i set the same FrozenColumnCount for both parent and child grids, on moving the horizontal scroll bar the columns for the parent grid are only frozen but not the child grid's columns. Is there any way to make the child grid's columns also to be treated as frozen on moving the horizontal scroll bar?

And seems like using RadTreeListView resolves all the issues i have i creating synchronization, but it doesn't have the Grouping by column feature available on it. Am i correct or is there any way to get the grouping for RadTreeListView?

[Dimitrina]

Hi Vivek,

In order to not scroll the RowDetails when horizontally scrolling the parent RadGridView, you should set AreRowDetailsFrozen="True" for it.

As to your second question, unfortunately RadTreeListView does not support Grouping. You can also refer to its online documentation.

Regards,
Didie
Telerik

 

 

[Vivek]

Setting AreRowDetailsFrozen is making the columns to not scroll at all, but what i need is when i set the frozen columns to some number of columns in the child grid and move the scroll bar, the frozen columns set are not treated as frozen and all the columns are getting moved.

Also I tried binding the Width property of a column to same property in both parent and child grids and somehow i am not getting the width updated on resize of the column. Do you have any sample on how to do this? 

Regarding the grouping on RadTreeListView, is there any item exists already to support this? If so, let me know the link for the item so that I will see and raise the vote count for that feature.

Also let me know if there is any item to create synchronisation between parent grid and child grid for RadGridView.

[Vivek]

Also when i bind the FrozenColumnsCount to a property, it's honored initially during the load of Grid, but when i move the FrozenColumnsSplitter, the property bound to FrozenColumnsCount is not getting updated. Do we need to trigger any event on move of splitter? If so, whats the event?

[Dimitrina]

Hi Vivek,

Unfortunately you are right, RadTreeListView does not support Grouping.
There is also not a feature request item as it is logically not clear how such a grouping should be performaed.
I will try to explain why. If you imagine the tree structure of the TreeListView and you have nodes bound to business objects having a property Name. The respective Names are item A, item B and item C on the first level. All those parent nodes have their children, for example: item A 1, item B 1, item C 1.
Now, if you group on the Name property, how should it be grouped? If the grouping is on the different Name values, then there will be child nodes in separate groups, not having a parent node. This would be in a contradiction with the tree-like structure of the control.

As to your question, you posted earlier today, would you please ensure you have specified a valid source for the binding?
For example:

<telerik:RadGridView
   ItemsSource="{Binding Clubs}"
   FrozenColumnCount="{Binding Count1, Source={StaticResource MyViewModel}}"/>

Regards,
Dimitrina
Telerik

 

 

[Vivek]

Regarding the RadTreeListView, we only need the grouping done at the parent row level, that means if you group on Name in the above example, all the parents should be grouped by their Name property and all the children under a parent would go into the group where it's parent goes. Is there a way that this could be achieved through any workarounds or Do you think this feature can be delivered so that we can file a request for this feature?

Also let me know if there is an item to support the synchronization between parent and child grids?

Regarding the frozencolumnscount binding, the binding is correct and is honored initially while loading the grid, but my set method of the binding property is not getting called on moving the splitter in the UI i.e., if i set the count initially to 2, the bar is present after two columns when i open application. Also, if i move the scrollbar, the frozen columns present to the left of the bar in the child grid are not actually frozen and are moving with the scroll bar movement. Let me know how to resolve this.

[Vivek]

Dimitrina,

I have also tried to bind scrollbar on RadGridView but it always fail. Please find below code,

​private void OnGrid1Loaded(object sender, RoutedEventArgs e)
{
Telerik.Windows.Controls.RadGridView rgvChildGrid = sender as Telerik.Windows.Controls.RadGridView;

ScrollBar vScrollBar = rgvChildGrid.ChildrenOfType<ScrollBar>().Where(b => b.Name == "PART_VerticalScrollBar").FirstOrDefault();
ScrollBar hScrollBar = this.Grid1.ChildrenOfType<ScrollBar>().Where(b => b.Name == "PART_HorizontalScrollBar").FirstOrDefault();
hScrollBar = this.Grid1.ChildrenOfType<ScrollBar>().Where(b => b.Name == "PART_HorizontalScrollBar").FirstOrDefault();
ScrollViewer viewer = this.rgvSmartModels.ChildrenOfType<ScrollViewer>().Where(b => b.Name == "ScrollViewer").FirstOrDefault(); 
}

I observed that vScrollBar, hScrollBar and viewer are all null.
P.S: I am able to get scrollbar and scrollviewer for other controls like grid, datagrid in above approach.

Could you help me to bind scrollviewer or scrollbar on radgridview ?

Regards, Vivek.

[Dimitrina]

Hello Vivek,

Thank you for sharing your feedback on how you would expect the grouping to be performed. I also consulted the case with the development team and I am afraid it cannot be currently achieved. There is not a workaround I could suggest.

As I already explained in my previous reply, different users expect different behavior of the grouping functionality. As the structure of the TreeListView is tree-like, if the grouping is only on the top level, then the feature will not be complete. If you have nodes bound to business objects having a property Name and the respective Names are item A, item B and item C on the first level then all those parent nodes will have their children, for example: item A 1, item B 1, item C 1 which will not be grouped.

As to the other issue you met, I tested on the Frozen Column example available with WPF Demos and it seems to work fine both the ways. You can also check the online demo for Silverlight. I observed the same results locally. As to the specific problem you experience, would you please open a new support thread and attach a demo project illustrating the issue there? You can take a look at this blog post for a reference on how to isolate an issue. 

As to the last question you posted yesterday, it seems you are not searching for the correct type. The scrolling in RadGridView is done via GridViewScrollViewer. Therefore, you should search the the children of this type. In the GridViewScrollViewer there are the scrollbars with names PART_ItemsScrollViewer and PART_HorizontalScrollBar. That way the vScrollBar and  hScrollBar should not be null.
You can also check the Scrolling two grids where a colleague of mine has attached a sample project.

Regards,
Dimitrina
Telerik

 

 

[Vivek]

Hi Dimitrina,

Thanks for redirecting me to the demos. I am able to get back the frozencolumnscount on moving the splitter in UI also if I attach it to property of RadSlider. 
Now I want to freeze the columns of the child grid that are present left to the splitter. On moving the scrollbar of the child grid, it works as expected, but when i move the parent grid's scroll bar, the contents of the child grid are also moving even the frozen columns . So I want to lock the child grid movement when parent grid scroll bar is moved. I found a property to do that "AreRowDetailsFrozen" and set to true on my parent grid, but it does not seem to be working. My child grid is present inside HierarchicalChildTemplate, but not in RowDetailsTemplate. So, I suspect if the property "AreRowDetailsFrozen" applies only to child grids that are present in RowDetailsTemplate. Is that true?
If so, do you have any other way to not move the child grid on moving the scroll bar of parent grid?

[Dimitrina]

Hello Vivek,

I am glad to hear that particular example helped you. Your observations are right, configuring the "AreRowDetailsFrozen" option for the parent RadGridView determines if its Row Details will be scrolled or not while scrolling the main, parent RadGridView. This applies only for Row Details hierarchy defined through specifying RowDetailsTemplate and not to hierarchy defined through specifying ChildTableDefinitions.
You can check our online documentation on Row Details for a further reference.

I am afraid I cannot suggest you another alternative to achieve the same.

Regards,
Dimitrina
Telerik

 

 

[Vivek]

Hi Dimitrina,

I have modified my code to use RowDetailsTemplate instead of HierarchyChildTemplate to get the feature AreRowDetailsFrozen and now i am able to freeze the columns of child grid. And the latest problem I am having is the GridViewToggleRowDetails column is displayed with a + icon for all the rows, but i want the + icon to be displayed only for the rows that have children. Setting the IsExpandable property to false for the rows that dont have children doesn't help. Could you help me out on displaying the + icon only for few rows and change it dynamically as children gets added and removed dynamically?

Regards,
Vivek

[Dimitrina]

Hi Vivek,

In order to hide the expand toggle button, you could apply a CellStyleSelector on the GridViewToggleButtonColumn.
For the case of not visible toggle button, you should create a style targeting GridViewCell.
For example:

<Grid.Resources>
     <Style x:Key="hiddenExpandButton"  TargetType="telerik:GridViewCell">
            <Setter Property="Visibility" Value="Hidden"></Setter>
     </Style>
</Grid.Resources>

Then when you select a style - if your item does not have a details, then you can return this style.

Furthermore, you can configure RadGridView with different RowDetailsVisibilityMode. You can also refer to the Row Details Visibility article for a further information.

Regards,
Dimitrina
Telerik

 

 

[Vivek]

Hi Dimitrina,

Thanks for the solution, it worked :)
On removing the items in the child grid, the + button is not displayed anymore, but the child grid's border lines are still present till the grid is refreshed or reloaded again. Is there any way to remove the grid border also when disabling the + button?

Thanks, 
Vivek

[Vanya Pavlova]

Hi Vivek,


Thank you for getting back to us. 

Yes, there is another alternative to achieve the desired behavior based on your requirements. 
The recommended approach in your case is to build custom hierarchy,as proposed in our online demos. 
*the same approach is applicable to WPF, as well. 

With single RowStyleSelector you may define, which row should be expanded or not based on underlying property value. 

The tricky part there is how to scroll child grid views in the same way, as the one defined within RowDetailsTemplate.

You should modify the default template of GridViewRow and remove the default Padding of 6px, around PART_HierarchyChildDataPresenter. This element is responsible for displaying child grid view elements. 
*Please check HierarchicalChildTemplate.png attachment for further reference. 

I'm also attaching you runnable sample demo, that you may use for testing purposes. 

Please take a look at this application and let me know how it corresponds to your needs. 


Regards,
Vanya Pavlova
Telerik

 

 

[Vivek]

Hi Vanya,

I dont want to use HierarchyChildTemplate because of the problems it has with the movement of child grid on moving the parent's scrollbar.
One issue I have got with RowDetailsTemplate is I have given a style for the GridViewToggleButton such that the expand button is displayed only when there are some children data corresponding to that row. It looked well initially on loading the grid, but when the toggle column is moved out of view using scroll bar and again brought into view then the style is not applied properly. My styleselector is sending the appropriate style but still that is not applied in the UI. I have done it the same way as demonstrated in the examples of CellStyleSelector  of GridView given in SDK smaples browser. Let me know if I am missing anything.

Thanks,
Vivek

[Vanya Pavlova]

Hello Vivek,

Thank you for getting back to us. 

The behavior you are currently experiencing is due to the Visibility setting, within the following style:

<Grid.Resources>
     <Style x:Key="hiddenExpandButton"  TargetType="telerik:GridViewCell">
       <Setter Property="Visibility" Value="Hidden"></Setter>
     </Style>
</Grid.Resources>

As you know, such an approach is not recommended to directly work with the visual elements and their direct visual properties, even when they are returned by StyleSelector.
 
By that reason I strongly advocate to use the approach with HierarchicalChildTemplate, as proposed in my previous reply. 

As per your problem with the Scrolling of the parent grid:

I would like to ask you how the suggestion with removed  PART_HierarchyChildDataPresenter's Padding works for you?

With removed Padding it should behave in the same way as DetailsPresenter, once the grid is scrolled. 

I look forward to hearing from you. 

Regards,
Vanya Pavlova
Telerik

 

 

[Vivek]

Hi Vanya,

I have tried removing the padding for PART_HierarchyChildPreseneter and now a thinner border is visible.
But removing the padding doesn't effect the scrolling  of the child grid, the child grid is still moving with the scrolling of the parent grid which is what i avoided using the AreRowDetailsFrozen property for RowDetailsTemplate. Let me know how to achieve this using HierarchyChildTemplate.

[Vivek]

Also do i really  need to include Telerik.Windows.Controls.GridView.xaml in my project to remove the padding? Isn't there any other way to do that ?

[Vanya Pavlova]

Hi Vivek,

Thank you for getting back to us. 

Telerik.Windows.Controls.GridView.xaml file contains all style files for RadGridView component. 
Since we need to edit the template of RadGridView control, we should directly edit the row style, as proposed. 

By that reason I've added to the test project direct XAML reference and edited the style from there. 

As it turns out, we could easily emulate the behavior of frozen row details using HierarchyChildTemplate. 
Within the same template, you may set SelectiveScrollingGrid.SelectiveScrollingOrientation of the Border, which holds PART_HierarchyChildPresenter element, to Vertical, as shown below:

<Border
                      Background="{StaticResource GridView_HierarchyBackground}"
                      Grid.Column="2"
                      Grid.Row="2"
                      Grid.ColumnSpan="2"
                      Padding="0"
                      BorderBrush="{StaticResource ControlOuterBorder}"
                      BorderThickness="0"
                      grid:SelectiveScrollingGrid.SelectiveScrollingOrientation="Vertical"
                      Visibility="{Binding IsExpanded, RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource BooleanToVisibilityConverter}}">
                  <ContentPresenter x:Name="PART_HierarchyChildPresenter"/>
              </Border>

Using this property setter, child grid view elements would not scroll horizontally. 

I've also fixed the thiny Border you were referring to and the project is updated accordingly.

Please take a look at the updated application and let me know how this corresponds to your needs.

I look forward to hearing from you.

Regards,
Vanya Pavlova
Telerik

 

 

[Vivek]

Hi Vanya,

I have tried using the updated Telerik.Windows.Controls.GridView.xaml an made the corresponding changes in my project and checked to see the scrolling, but the scrolling still behaves the same way as it is earlier. But it worked well in your application. Also the thin line still comes after deleting the children.
Let me know if i need to do something else to make it work.

Thanks,
Vivek.

[Vanya Pavlova]

Hello Vivek,

You do not have to perform any additional steps in order to achieve the desired behavior.
I believe that we are talking about some project specific issue. 

It would be best to try to isolate the problem in a smalll runnable project and sent it back to us as an attachment in a new support thread. 

We will take a look at this project and will make appropriate modifications based on your needs. 

Regards,
Vanya Pavlova
Telerik

 

 

[Vivek]

Hi Vanya,

On relooking at my project and the added Telerik.Windows.Controls.GridView.xaml file, I found that the GridViewRowStyle I specified in the BasedOn field is not pointing to the one defined in the added xaml file, but is pointing to default definition present in the added Telerik reference dlls. So, how to make it point to the xaml file added to the project instead of the existing definition in the dlls?

Thanks,
Vivek

[Vanya Pavlova]

Hi Vivek,

Actually they are the same.
The project contains direct XAML reference, because we modified the default template of GridViewRow. You may remove Office_Black assembly reference and use only XAML files, directly instead. 

Another option would be to merge only the modified file for RadGridView and keep the assembly reference, as proposed below:

<ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
               <ResourceDictionary Source="/Telerik.Windows.Themes.Office_Black;component/Themes/System.Windows.xaml"/>
               <ResourceDictionary Source="/Telerik.Windows.Themes.Office_Black;component/Themes/Telerik.Windows.Controls.xaml"/>
               <ResourceDictionary Source="/Telerik.Windows.Themes.Office_Black;component/Themes/Telerik.Windows.Controls.Input.xaml"/>
               <ResourceDictionary Source="Telerik.Windows.Controls.GridView.xaml"/>
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>

I'm also attaching you the updated project. 

Regards,
Vanya Pavlova
Telerik

 

 

[Vivek]

That worked, now my code is pointing to the updated xaml file. I can see the change in the padding and coming the locking of child grid movement, the grid is locked, but some white layer is scrolling on top of the grid which makes my child data overlapped by that layer. How to make it work as expected?
I am having a custom style applied to my Grid which is obviously no longer applied after making the BasedOn point to the style in the provided xaml file. How to achieve it with my custom style?

Thanks,
Vivek.

[Vanya Pavlova]

Hello Vivek,

Can you please check whether the modifed part of GridViewRow is exact to the following mark-up?

<Border
                      Background="{StaticResource GridView_HierarchyBackground}"
                      Grid.Column="2"
                      Grid.Row="2"
                      Grid.ColumnSpan="2"
                      Padding="0"
                      BorderBrush="{StaticResource ControlOuterBorder}"
                      BorderThickness="0"
                      grid:SelectiveScrollingGrid.SelectiveScrollingOrientation="Vertical"
                      <!--Remove this-->
                      grid:SelectiveScrollingGrid.SelectiveScrollingClip="True"
                      Visibility="{Binding IsExpanded, RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource BooleanToVisibilityConverter}}">
                  <ContentPresenter x:Name="PART_HierarchyChildPresenter"/>
              </Border>

The white Border could be caused by the settings marked in red above.

As per your second problem we might be only guessing what is causing this behavior.
It would be best if you isolate the problem in a small runnable project and sent it back to us as an attachment in a new support thread.

I look forward to hearing from you.
 

Regards,
Vanya Pavlova
Telerik