WPF nested ItemsControl binding issue - wpf

Question

Why is the second ItemsControl binding to FirstName not working?
<ItemsControl Grid.Row="1" x:Name="PMItmsControl" VerticalAlignment="Top" ItemsSource="{Binding FirstEntityCollection}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<VirtualizingStackPanel Orientation="Vertical"/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<Border CornerRadius="5" BorderBrush="YellowGreen" BorderThickness="1" Margin="5">
<Grid Width="auto" Height="100" VerticalAlignment="Top">
<Grid.RowDefinitions>
<RowDefinition/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="60*"/>
<ColumnDefinition Width="40*"/>
</Grid.ColumnDefinitions>
<TextBlock **x:Name="tb"** Width="100" Foreground="White" HorizontalAlignment="Center" VerticalAlignment="Center" Margin="10" Text="{Binding FirstName}" FontSize="10" >
</TextBlock>
<ItemsControl ItemsSource="{Binding SecondEntityCollection}" Grid.Column="1" VerticalAlignment="Top">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<VirtualizingStackPanel Orientation="Vertical"/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="50*"/>
<ColumnDefinition Width="50*"/>
</Grid.ColumnDefinitions>
<TextBlock Text="{Binding SecondName}" Margin="5" Foreground="White" />
<TextBlock Grid.Column="1" Text="{Binding **Path= Text, ElementName=tb**}" Margin="5" Width="40">
</TextBlock>
</Grid>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</Grid>
</Border>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
and in my code behind, i declare following classes:
public class FirstEntity
{
public string FirstName { get; set; }
public ObservableCollection<SecondEntity> SecondEntityCollection { get; set; }
}
public class SecondEntity
{
public string SecondName { get; set; }
}
and the FirstEntityCollection is declare as following in my code behind:
public ObservableCollection<FirstEntity> FirstEntityCollection {get;set;}
not sure if i make my issue clear?
can someone give me any idea? please.
thanks much. very appreciate.
updated: I just found another solution use x:Name="tb" to above Bold code. and then changes Text="{Binding Path= DataContext.FirstName, RelativeSource={RelativeSource Mode=FindAncestor,AncestorType={x:Type ItemsControl},AncestorLevel=2}}" to Text="{Binding Text,ElementName=tb}"
thanks Maxi.
----------------updated again-------------
this is the first time I asked question in stackoverflow, the question editor is not easy to input code and comments and the formatting is so bad, maybe I don't find a easy way to use. anyway thanks.

Answer 1

The first mess-up you need to get rid of is setting Foreground="White" on the TextBlock.
Based on your question update, please find below XAML bindings.
<ItemsControl Grid.Row="1" x:Name="PMItmsControl" VerticalAlignment="Top" ItemsSource="{Binding FirstEntityCollection}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<VirtualizingStackPanel Orientation="Vertical"/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<Border CornerRadius="5" BorderBrush="YellowGreen" BorderThickness="1" Margin="5">
<Grid Width="auto" Height="100" VerticalAlignment="Top">
<Grid.RowDefinitions>
<RowDefinition/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="60*"/>
<ColumnDefinition Width="40*"/>
</Grid.ColumnDefinitions>
<TextBlock Width="100" HorizontalAlignment="Center" VerticalAlignment="Center" Margin="10" Text="{Binding FirstName}" FontSize="10" >
</TextBlock>
<ItemsControl ItemsSource="{Binding SecondEntityCollection}" Grid.Column="1" VerticalAlignment="Top">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<VirtualizingStackPanel Orientation="Vertical"/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="50*"/>
<ColumnDefinition Width="50*"/>
</Grid.ColumnDefinitions>
<TextBlock Text="{Binding SecondName}" Margin="5" />
<!--Notice setting DataContext to TextBlock below-->
<TextBlock Grid.Column="1" DataContext="{Binding Path=DataContext, RelativeSource={RelativeSource Mode=FindAncestor,AncestorType={x:Type ItemsControl}}}" Text="{Binding Path= FirstName}" Margin="5" Width="Auto"/> </Grid>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</Grid>
</Border>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
Hope this give you an idea to start with...