Share via

Databinding for nested collections in XAML (WPF and Silverlight)

  • Article

In Blend, you can drag a collection from the Data pane to the artboard to generate a listbox that is databound to the collection.  You may then drag/drop (in Detail mode) properties under the collection to create textblocks databound to the selected item in the listbox. But if you have nested collections, this is currently not supported (v4).

This post shows sample code for databinding a nested collection:
Assuming there is an AuthorDataSource with this structure:

Authors (list)
 - - Name
 - - Books (list)
     | -  - Title
     | -  - Contents

Sample code :
  <Window.Resources>
    <DataTemplate x:Key="ItemTemplate1">
      <StackPanel>
        <TextBlock Text="{Binding Name}"/>
      </StackPanel>
    </DataTemplate>
    <DataTemplate x:Key="ItemTemplate2">
      <StackPanel>
        <TextBlock Text="{Binding Title}"/>
      </StackPanel>
    </DataTemplate>
  </Window.Resources>
  <Grid x:Name="LayoutRoot" DataContext="{Binding Source={StaticResource AuthorDataSource}}">
    <ListBox x:Name="AuthorList" ItemTemplate="{DynamicResource ItemTemplate1}" ItemsSource="{Binding Authors }" >
    <ListBox x:Name="BookList" DataContext="{Binding SelectedItem, ElementName=AuthorList}" ItemsSource="{Binding Books }" ItemTemplate="{DynamicResource ItemTemplate2}" />
    <TextBlock  x:Name="BookContent"   DataContext="{Binding SelectedItem, ElementName=BookList}"  Text="{Binding Contents }" />
  </Grid>

The result would be 2 listboxes and a textblock.  The AuthorList listbox would list names of authors.  Selecting an author in AuthorList would list all books written by that author in the BookList listbox.  Selecting a title in Booklist would display the contents of the book in the textbock.
 

Same codes in listbox BookList are applicable to N levels of nested collections