Parent Child Datagrids have different ItemsSource in MVVM

Question

I have a DataGrid and in that DataGrid's DataGrid.RowDetailsTemplate I have put another DataGrid.Now my first Datagrid is having ItemsSource="{Binding MatchObsCollection}" and My inner Datagrid which is in my DataGrid.RowDetailsTemplate has separate ItemSource. But inner Datagrid is notpopulating. I am using MVVM and I am binding both the Datagrid s by ObservableCollections on Viewmodel. Can anyone help me please(My question is almost same as Displaying hierarchal parent child data in WPF DataGrid but I have not found any good answer in that post also) .My xaml code is attached below.Thanking you,

<DataGrid HorizontalAlignment="Stretch" Margin="0" x:Name="dataGridParent" ItemsSource="{Binding MatchObsCollection}"
                      Style="{StaticResource EfesDataGridStyle}" FrozenColumnCount="14" GridLinesVisibility="All" 
                      HorizontalGridLinesBrush="#DADADA" VerticalGridLinesBrush="#DADADA" Cursor="Hand" AutoGenerateColumns="False" 
                      RowDetailsVisibilityMode="Visible" 
                      util:ParentMatchDataGridRowClickHandler.MethodName="ParentMatchDatagrdRowClick"
                      SelectedItem="{Binding SelectedMatch}"
                      >
<DataGrid.Columns>
                    <DataGridTextColumn Header="Kod" Binding="{Binding MatchNo}"  Width="50*" />
                    <DataGridTextColumn Header="Tarih" Binding="{Binding MatchDate}" Width="70*"/>
                    <DataGridTextColumn Header="Ev Sahibi" Binding="{Binding MatchHome}" Width="100*"/>
                    <DataGridTextColumn Header="Konuk" Binding="{Binding MatchVisitor}" Width="50*"/>
                    <DataGridTextColumn Header="1" Binding="{Binding MatchResultHomeOdds}" Width="30*" ></DataGridTextColumn>                 

                    <DataGridTextColumn Header="X" Binding="{Binding MatchResultDrawOdds}" Width="30*" />
                    <DataGridTextColumn Header="2" Binding="{Binding MatchResultVisitorOdds}" Width="30*"/>
                    <DataGridTextColumn Header="T1" Binding="{Binding MatchresultSingleHomeOdds}" Width="30*" />
                    <DataGridTextColumn Header="TX" Binding="{Binding MatchresultSingleDrawOdds}" Width="30*" />
                    <DataGridTextColumn Header="T2" Binding="{Binding MatchresultSingleVisitorOdds}" Width="30*" />
                    <DataGridTextColumn Header="+"  CellStyle ="{StaticResource DataGridCellStyle}"  Binding="{Binding TotalBets}" Width="30*"/>


                    <DataGridTextColumn Header="Min" Binding="{Binding MatchMin}" Width="30*" />
                    <DataGridTextColumn Header="Lig" Binding="{Binding TeamName}" Width="70*" />

                    <DataGridTemplateColumn Header="Durum" Width="Auto" >
                        <DataGridTemplateColumn.CellTemplate>
                            <DataTemplate>
                                <ToggleButton  x:Name="toggleBtn" VerticalAlignment="Center" Margin="0" Style="{StaticResource SlidingToggleButton}" BorderBrush="{x:Null}" IsChecked="{Binding ToggleBtn}" Background="#FF2F63FF" />
                            </DataTemplate>
                        </DataGridTemplateColumn.CellTemplate>
                    </DataGridTemplateColumn>                    
                </DataGrid.Columns>

<DataGrid.RowDetailsTemplate x:Uid="test123">
                    <DataTemplate x:Name="testTemplete">
                        <DataGrid x:Name="innerGrid" ItemsSource="{Binding SubBetMatchDataListforChildGrid}" 
                                  Style="{StaticResource EfesDataGridStyle}" Margin="50,2,2,2" MinHeight="40"  
                                  GridLinesVisibility="All" HorizontalGridLinesBrush="#DADADA" VerticalGridLinesBrush="#DADADA" 
                                  Visibility="Collapsed" >

<DataGrid.Columns>
                                <DataGridTextColumn Header="Kod" Binding="{Binding Code}" Width="3*" />
                                <DataGridTextColumn Header="Alt Secenakler" Binding="{Binding SubOptions}" Width="7*" />                                
                            </DataGrid.Columns>

</DataGrid>                      
                    </DataTemplate>
                </DataGrid.RowDetailsTemplate>
            </DataGrid>

kmatyaszek kmatyaszek · Accepted Answer · 2013-09-14T20:33:41

I am using MVVM and I am binding both the Datagrid s by ObservableCollections on Viewmodel.

You should have only one ObservableCollection (MatchObsCollection) in your ViewModel. If you have MatchObsCollection and SubBetMatchDataListforChildGrid in ViewModel this code doesn't work.

The DataContext of the RowDetails is the row item.

So if you want to binding to the ObservableCollection in the ViewModel you should use following code in RowDetailsTemplate:

...
<DataGrid.RowDetailsTemplate x:Uid="test123">
        <DataTemplate x:Name="testTemplete">
            <DataGrid x:Name="innerGrid" 
                      ItemsSource="{Binding Path=DataContext.SubBetMatchDataListforChildGrid, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type Window}}}" 
...

If you want to binding to selected object inner ObservableCollection your classes should looks like this:

class Foo
{
    public int MatchNo { get; set; }
    public DateTime MatchDate { get; set; }
    // more properties
    public ObservableCollection<Boo> SubBetMatchDataListforChildGrid { get; set; }
}

class Boo
{
    public string Code { get; set; }
    public string SubOptions { get; set; }
}

And in the ViewModel you should have ObservableCollection of Foo:

class MainViewModel
{
    public ObservableCollection<Foo> MatchObsCollection { get; set; }   
}

Parent Child Datagrids have different ItemsSource in MVVM

1 Answers