Search code examples
silverlightdata-bindingdatagridtoolkit

Using Datagrid within RowDetailsTemplate of another Datagrid


I would like to use a DataGrid within the RowDetailsTempalte of another Datagrid. This inner Datagrid should have its columns bound to a property of the current object in the outer Datagrid. For example, if the outer Datagrid is displaying all contacts by first name and last name, if I select a row I should be able to see another Datagrid containing all phone numbers associated with that contact. What I am most interested in is how the data of the inner Datagrid binds to the data of the outer Datagrid. Here is some XAML that I have so far to start with:

<data:DataGrid MinHeight="700" x:Name="contacts">
                <data:DataGrid.Columns>                       
                    <data:DataGridTextColumn Header="First Name" Binding="{Binding FirstName}"></data:DataGridTextColumn>
                    <data:DataGridTextColumn Header="Last Name" Binding="{Binding LastName}"></data:DataGridTextColumn>                        
                 </data:DataGrid.Columns>
                <data:DataGrid.RowDetailsTemplate>
                    <DataTemplate>
                        <StackPanel Background="Black">
                            <StackPanel Background="White" Margin="16">
                                <data:DataGrid DataContext="Contact.Phones">

                                </data:DataGrid>
                            </StackPanel>
                        </StackPanel>
                    </DataTemplate>
                </data:DataGrid.RowDetailsTemplate>
            </data:DataGrid>

Solution

  • The last answer on this thread helped me: How is access inner Datagrid in Silverlight?.

    On the inner DataGrid I set ItemsSource="{Binding Phones}" and removed the DataContext.