We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
close icon

Master-DetailView alternate row style

How can I style the area around the details SfDataGrid so that its background alternates along with its parent row?
At the moment, all the detail SfDataGrids have the same Background which makes it slight confusing to look at!

I've attached an image to demonstrate.

Thanks again!

Attachment: changeBackgroundColour_e2a95706.rar

2 Replies

JR James Randle December 7, 2015 03:22 PM UTC

I can see that i need to style the DetailsViewRowControl, but looking at the visual tree, it seems that the VirtualizingCellsControl (the row) and the DetailsViewRowControl (the area surrounding the detail SfDataGrid) both belong to the same parent and there is no property to connect a particular DetailsViewRowControl to the corresponding VirtualizingCellsControl .

If I can get a reference to the corresponding VirtualizingCellsControl from a particular DetailsViewRowControl then I can bind to that row's style DetailsViewRowControl.Background="{Binding Path=Background, Element=<Corresponding VirtualizingCellsControl>}".


SP Sowndaiyan Paulpandi Syncfusion Team December 9, 2015 03:59 AM UTC

Hi James,

Thank you for contacting Syncfusion Support.

We have analyzed your query. In SfDataGrid if you set “DetailsViewRowControl Background color, then it is not possible to change its background color for each DetailsViewDataGrid at runtime. However you can set the Set the Background color for current selected DetailViewDataGrid by customize style of DetailsViewRowControl and DetailsViewDataGrid. We have prepared a sample for set current selected DetailViewDataGrid background color and you can download the sample from the below location. In this sample we have set the Background color using converter and SfDataGrid.SelectionChanged event.

Sample : http://www.syncfusion.com/downloads/support/forum/121371/ze/MasterDetailsView_WPF-418660119-881815365



Live Chat Icon For mobile
Up arrow icon