title: treeview binding wpf cannot bind nested property in a class
body: <p>New to wpf and therefore struggling a bit.
  I am putting together a quick demo before we go for the full implementation
  I have a treeview on the left  with </p>
  
  <pre><code>Continent
      Country
         City  structure
  </code></pre>
  
  <p>when a user select the city it should populate some textboxes in a tabcontrol on the right hand side</p>
  
  <p>I made it sort of work but cannot make it work with composite objects.</p>
  
  <p>In a nutshell can you spot what is wrong with my zaml or code.
  <strong>Why is not binding to a my CityDetails.ClubsCount or CityDetails.PubsCount?</strong></p>
  
  <p>What I am building is based on  <a href="http://www.codeproject.com/KB/WPF/TreeViewWithViewModel.aspx" rel="nofollow noreferrer">http://www.codeproject.com/KB/WPF/TreeViewWithViewModel.aspx</a> </p>
  
  <p>Thanks a lot for any suggestions or reply </p>
  
  <h1>DataModel</h1>
  
  <pre><code>public class City
  {
      public City(string cityName)
      {
          CityName = cityName;
      }
  
      public string CityName { get; set; }
      public string Population { get; set; }
      public string Area { get; set; }
      public CityDetails CityDetailsInfo { get; set; }
  }
  
  public class CityDetails
  {
      public CityDetails(int pubsCount,int clubsCount)
      {
          PubsCount = pubsCount;
          ClubsCount = clubsCount;
      }
  
      public int ClubsCount { get; set; }
      public int PubsCount { get; set; }
  }
  </code></pre>
  
  <h1>ViewModel</h1>
  
  <pre><code>public class CityViewModel : TreeViewItemViewModel
  {
      private  City _city;
      private RelayCommand _testCommand;
      public CityViewModel(City city, CountryViewModel countryViewModel):base(countryViewModel,false)
      {
          _city = city;
      }
  
      public string CityName
      {
          get { return _city.CityName; }
      }
      public string Area
      {
          get { return _city.Area; }
      }
      public string Population
      {
          get { return _city.Population; }
      }
      public City City
      {
      get { return _city; }
      set { _city = value; }
      }
  
      public CityDetails CityDetailsInfo
      {
          get { return _city.CityDetailsInfo; }
          set { _city.CityDetailsInfo = value; }
      }
  }
  </code></pre>
  
  <h1>XAML</h1>
  
  <pre><code>&lt;DockPanel&gt;
      &lt;DockPanel LastChildFill="True"&gt;
          &lt;Label DockPanel.Dock="top" Content="Title " HorizontalAlignment="Center"&gt;&lt;/Label&gt;
          &lt;StatusBar DockPanel.Dock="Bottom"&gt;
              &lt;StatusBarItem Content="Status Bar" &gt;&lt;/StatusBarItem&gt;
          &lt;/StatusBar&gt;
          &lt;Grid DockPanel.Dock="Top"&gt;
              &lt;Grid.ColumnDefinitions&gt;
                  &lt;ColumnDefinition/&gt;
                  &lt;ColumnDefinition Width="Auto"/&gt;
                  &lt;ColumnDefinition Width="2*"/&gt;
              &lt;/Grid.ColumnDefinitions&gt;
              &lt;TreeView Name="tree" ItemsSource="{Binding Continents}"&gt;
                  &lt;TreeView.ItemContainerStyle&gt;
                      &lt;Style TargetType="{x:Type TreeViewItem}"&gt;
                          &lt;Setter Property="IsExpanded" Value="{Binding IsExpanded,Mode=TwoWay}"/&gt;
                          &lt;Setter Property="IsSelected" Value="{Binding IsSelected,Mode=TwoWay}"/&gt;
                          &lt;Setter Property="FontWeight" Value="Normal"/&gt;
                          &lt;Style.Triggers&gt;
                              &lt;Trigger Property="IsSelected" Value="True"&gt;
                                  &lt;Setter Property="FontWeight" Value="Bold"&gt;&lt;/Setter&gt;
                              &lt;/Trigger&gt;
                          &lt;/Style.Triggers&gt;
                      &lt;/Style&gt;
                  &lt;/TreeView.ItemContainerStyle&gt;
  
                  &lt;TreeView.Resources&gt;
                      &lt;HierarchicalDataTemplate DataType="{x:Type ViewModels:ContinentViewModel}"
                                        ItemsSource="{Binding Children}"&gt;
                          &lt;StackPanel Orientation="Horizontal"&gt;
                              &lt;Image Width="16" Height="16" Margin="3,0" Source="Images\Continent.png"/&gt;
                              &lt;TextBlock Text="{Binding ContinentName}"/&gt;
                          &lt;/StackPanel&gt;
                      &lt;/HierarchicalDataTemplate&gt;
  
                      &lt;HierarchicalDataTemplate DataType="{x:Type ViewModels:CountryViewModel}"
                                        ItemsSource="{Binding Children}"&gt;
                          &lt;StackPanel Orientation="Horizontal"&gt;
                              &lt;Image Width="16" Height="16" Margin="3,0" Source="Images\Country.png"/&gt;
                              &lt;TextBlock Text="{Binding CountryName}"/&gt;
                          &lt;/StackPanel&gt;
                      &lt;/HierarchicalDataTemplate&gt;
                      &lt;DataTemplate DataType="{x:Type ViewModels:CityViewModel}" &gt;
                          &lt;StackPanel Orientation="Horizontal"&gt;
                              &lt;Image Width="16" Height="16" Margin="3,0" Source="Images\City.png"/&gt;
                              &lt;TextBlock Text="{Binding CityName}"/&gt;
                          &lt;/StackPanel&gt;
                      &lt;/DataTemplate&gt;
                  &lt;/TreeView.Resources&gt;
              &lt;/TreeView&gt;
              &lt;GridSplitter Grid.Row="0" Grid.Column="1" Background="LightGray"
                   Width="5" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"/&gt;
              &lt;Grid Grid.Column="2" Margin="5" &gt;
                  &lt;TabControl&gt;                                
                      &lt;TabItem Header="Details" DataContext="{Binding Path=SelectedItem.City, ElementName=tree, Mode=OneWay}"&gt;
                          &lt;StackPanel &gt;
                              &lt;TextBlock VerticalAlignment="Center" FontSize="12" Text="{Binding CityName}"/&gt;
                              &lt;TextBlock VerticalAlignment="Center" FontSize="12" Text="{Binding Area}"/&gt;
                              &lt;TextBlock VerticalAlignment="Center" FontSize="12" Text="{Binding Population}"/&gt;
                              &lt;!-- DONT WORK WHY--&gt;
                              &lt;TextBlock VerticalAlignment="Center" FontSize="12" Text="{Binding SelectedItem.CityDetailsInfo.ClubsCount}"/&gt;
                              &lt;TextBlock VerticalAlignment="Center" FontSize="12" Text="{Binding  SelectedItem.CityDetailsInfo.PubsCount}"/&gt;
                          &lt;/StackPanel&gt;
                      &lt;/TabItem&gt;
                  &lt;/TabControl&gt;
              &lt;/Grid&gt;
          &lt;/Grid&gt;
      &lt;/DockPanel&gt;       
  &lt;/DockPanel&gt;
  </code></pre>