Datagrid nested inside another datagrid's RowDetailsTemplate breaks mouse wheel scrolling

Question

I have a DataGrid "nested" inside another DataGrid's RowDetailsTemplate. Scrolling works fine whenever my mouse is over the main portion of the row on the parent DataGrid, but when the mouse is over the DataGrid nested inside the RowDetailsTemplate, it stops scrolling.

Here is the DataGrid setup:

<my:DataGrid Margin="-2,36,-2,1" 
                         Background="White" 
                         CanUserReorderColumns="True" 
                         CanUserResizeRows="False" 
                         ColumnHeaderHeight="35" 
                         HorizontalGridLinesBrush="LightGray" 
                         VerticalGridLinesBrush="White" 
                         x:Name="testList" 
                         VerticalScrollBarVisibility="Visible" 
                         FlowDirection="LeftToRight" 
                         AutoGenerateColumns="False" 
                         IsReadOnly="True" 
                         ScrollViewer.CanContentScroll="False" 
                         SelectionMode="Single" 
                         HeadersVisibility="Column" 
                         GridLinesVisibility="None"
                         >

                <my:DataGrid.Columns>

                    <my:DataGridTemplateColumn MinWidth="60" CanUserSort="True" SortMemberPath="ResultType">
                        <my:DataGridTemplateColumn.Header>
                            <TextBlock FontSize="14" Text="Result"></TextBlock>
                        </my:DataGridTemplateColumn.Header>
                        <my:DataGridTemplateColumn.CellTemplate>
                            <DataTemplate>
                                <Grid Margin="4" VerticalAlignment="Center" HorizontalAlignment="Center">
                                    <Image Height="35" Width="35" Source="{Binding TestResultImage}" ToolTip="{Binding ResultType}" />
                                </Grid>
                            </DataTemplate>
                        </my:DataGridTemplateColumn.CellTemplate>
                    </my:DataGridTemplateColumn>

                    <my:DataGridTemplateColumn MinWidth="100" CanUserSort="True" SortMemberPath="TestName">
                        <my:DataGridTemplateColumn.Header>
                            <TextBlock Margin="3" FontSize="14" Text="Dates"></TextBlock>
                        </my:DataGridTemplateColumn.Header>
                        <my:DataGridTemplateColumn.CellTemplate>
                            <DataTemplate>
                                <Grid Margin="5" VerticalAlignment="Center" HorizontalAlignment="Center">
                                    <TextBlock FontSize="14" TextWrapping="Wrap" AllowDrop="True" Text="{Binding TestName}" ToolTip="This test analyzed data from this date" />
                                </Grid>
                            </DataTemplate>
                        </my:DataGridTemplateColumn.CellTemplate>
                    </my:DataGridTemplateColumn>

                    <my:DataGridTemplateColumn MinWidth="150" Width="*" CanUserSort="True" x:Name="TestDetails" SortMemberPath="Result">
                        <my:DataGridTemplateColumn.Header>
                            <TextBlock Margin="4" FontSize="14" Text="Details"></TextBlock>
                        </my:DataGridTemplateColumn.Header>
                        <my:DataGridTemplateColumn.CellTemplate>
                            <DataTemplate>
                                <Grid Margin="5" VerticalAlignment="Center">
                                    <TextBlock TextWrapping="Wrap" FontSize="13" Text="{Binding Result}" ToolTip="Click for more details about this test" />
                                </Grid>
                            </DataTemplate>
                        </my:DataGridTemplateColumn.CellTemplate>
                    </my:DataGridTemplateColumn>

                </my:DataGrid.Columns>

                <my:DataGrid.RowDetailsTemplate>
                    <DataTemplate>
                        <Grid>
                        <my:DataGrid Background="White"
                                     BorderThickness="0" 
                                     CanUserReorderColumns="True" 
                                     HeadersVisibility="Column" 
                                     CanUserResizeRows="False" 
                                     ColumnHeaderHeight="25" 
                                     ItemsSource="{Binding GuiValidatorResults}" 
                                     HorizontalGridLinesBrush="LightGray" 
                                     x:Name="validatorList" 
                                     VerticalGridLinesBrush="White" 
                                     VerticalScrollBarVisibility="Auto" 
                                     HorizontalScrollBarVisibility="Auto" 
                                     FlowDirection="LeftToRight" 
                                     AutoGenerateColumns="False" 
                                     IsReadOnly="True" 
                                     ScrollViewer.CanContentScroll="False" 
                                     ScrollViewer.ScrollChanged=""
                                     SelectionMode="Single" 
                                     MouseDoubleClick="HideAllValidatorDetails"
                                     GridLinesVisibility="Horizontal">
                            <my:DataGrid.Columns>

                                <my:DataGridTemplateColumn MinWidth="60" CanUserSort="True" SortMemberPath="ResultType">
                                    <my:DataGridTemplateColumn.Header>
                                        <TextBlock Margin="0" Text="Result"></TextBlock>
                                    </my:DataGridTemplateColumn.Header>
                                    <my:DataGridTemplateColumn.CellTemplate>
                                        <DataTemplate>
                                            <Grid Margin="0">
                                                <Image Height="25" Width="25" Source="{Binding ValidatorResultImage}" ToolTip="{Binding ResultType}" />
                                            </Grid>
                                        </DataTemplate>
                                    </my:DataGridTemplateColumn.CellTemplate>
                                </my:DataGridTemplateColumn>

                                <my:DataGridTemplateColumn MinWidth="100" CanUserSort="True" SortMemberPath="DescriptiveTestLabel">
                                    <my:DataGridTemplateColumn.Header>
                                        <TextBlock Margin="0" Text="Validator"></TextBlock>
                                    </my:DataGridTemplateColumn.Header>
                                    <my:DataGridTemplateColumn.CellTemplate>
                                        <DataTemplate>
                                            <Grid Margin="5">
                                                <TextBlock TextWrapping="Wrap" AllowDrop="True" Text="{Binding DescriptiveTestLabel}" />
                                            </Grid>
                                        </DataTemplate>
                                    </my:DataGridTemplateColumn.CellTemplate>
                                </my:DataGridTemplateColumn>

                                <my:DataGridTemplateColumn MinWidth="150" Width="*" CanUserSort="True" SortMemberPath="Text">
                                    <my:DataGridTemplateColumn.Header>
                                        <TextBlock Margin="0" Text="Message"></TextBlock>
                                    </my:DataGridTemplateColumn.Header>
                                    <my:DataGridTemplateColumn.CellTemplate>
                                        <DataTemplate>
                                            <Grid Margin="5">
                                                <TextBlock TextWrapping="Wrap" AllowDrop="True" Text="{Binding Text}" />
                                            </Grid>
                                        </DataTemplate>
                                    </my:DataGridTemplateColumn.CellTemplate>
                                </my:DataGridTemplateColumn>

                            </my:DataGrid.Columns>

                            <my:DataGrid.RowDetailsTemplate>
                                <DataTemplate>
                                            <GroupBox FontWeight="Bold" Margin="5" Header="Additional Details:">
                                        <Grid Margin="5" x:Name="WidthSetter">
                                            <Grid.RowDefinitions>
                                                <RowDefinition />
                                                <RowDefinition />
                                            </Grid.RowDefinitions>
                                            <Grid.Resources>
                                                <DataTemplate x:Key="AdditionalDetailsTemplate">
                                                    <Grid>
                                                        <DockPanel>
                                                            <TextBlock HorizontalAlignment="Left" Margin="0,0,0,10" Text="{Binding Path=.}" TextWrapping="Wrap" />
                                                        </DockPanel>
                                                    </Grid>
                                                </DataTemplate>
                                            </Grid.Resources>
                                            <ListView FontWeight="Normal" 
                                                      ScrollViewer.HorizontalScrollBarVisibility="Disabled" 
                                                      HorizontalContentAlignment="Stretch" 
                                                      BorderThickness="0" 
                                                      HorizontalAlignment="Left" 
                                                      Margin="0" 
                                                      Width="{Binding ActualWidth, ElementName=WidthSetter}" ItemTemplate="{StaticResource AdditionalDetailsTemplate}" ItemsSource="{Binding Path=AdditionalDetails}" />

                                            <Grid Grid.Row="1" Margin="3,5,5,5">

                                                <Grid.RowDefinitions>
                                                    <RowDefinition />
                                                    <RowDefinition />
                                                </Grid.RowDefinitions>
                                                <TextBlock FontWeight="Bold" Text="Records involved:" />
                                                <ListView BorderThickness="0" ItemsSource="{Binding InvolvedRecords}" ItemTemplate="{StaticResource ValidatorInvolvedRecordsTemplate}" Grid.Row="1" />
                                            </Grid>
                                        </Grid>
                                    </GroupBox>
                                </DataTemplate>
                            </my:DataGrid.RowDetailsTemplate>
                        </my:DataGrid>
                        </Grid>
                    </DataTemplate>
                </my:DataGrid.RowDetailsTemplate>

            </my:DataGrid>

I would think that there would be some way to tell the child DataGrid to pass the scroll event up to the "testList" DataGrid, but I haven't been able to figure out how.

Thanks!

Answer 1

Unless the RowDetails is handling the scrolling itself, try setting the property ScrollViewer.CanContentScroll on the main DataGrid to false.

ScrollViewer.CanContentScroll="False"