Question

I have a WPF user control that contains a DataGrid. This DG contains several columns including a ComboBox for states. The list of states is populated and stored as a property in my ViewModel.

I am trying to bind the StateList Property to the ItemsSource of my Combobox but when I run the form and try to edit the DG, the combobox does not contain any values, the combobox is empty.

Here is the XAML for the usercontrol.

<UserControl x:Class="myproject.View.ucContactView"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         mc:Ignorable="d" d:DesignHeight="475" d:DesignWidth="977">
<UserControl.Resources>
    <ResourceDictionary Source="/Templates/MyResourceDictionary.xaml"/>
</UserControl.Resources>
<Grid DataContext="{Binding ViewModel}">
    <DataGrid AutoGenerateColumns="False" ItemsSource="{Binding AddressCollectionViewSource.View}">
        <DataGridTemplateColumn Header="State" Width="160">
            <DataGridTemplateColumn.CellTemplate>
                <DataTemplate>
                    <TextBlock Text="{Binding StateDescription}"/>
                </DataTemplate>
            </DataGridTemplateColumn.CellTemplate>
            <DataGridTemplateColumn.CellEditingTemplate>
                <DataTemplate>
                    <StackPanel Orientation="Horizontal">
                        <ComboBox Name="cboState"
                                  SelectedValuePath="StateKey"
                                  ItemTemplate="{StaticResource dtStateTemplate}"
                                  ItemsSource="{Binding StateList}" 
                                  SelectedItem="{Binding StateKey, Mode=TwoWay}"
                                  Width="100" />
                    </StackPanel>
                </DataTemplate>
            </DataGridTemplateColumn.CellEditingTemplate>
        </DataGridTemplateColumn>
    </DataGrid>
</Grid>
</UserControl>

The odd thing is that if I create another combobox on this usercontrol with the exact same combobox, this combobox works as expected.

<!-- this works as long as it's not in the DG -->
<StackPanel Height="126" HorizontalAlignment="Left" Margin="766,275,0,0" Name="stackPanel1" VerticalAlignment="Top" Width="200" >
    <ComboBox Name="cboState2"
          SelectedValuePath="StateKey"
          ItemTemplate="{StaticResource dtStateTemplate}"
          ItemsSource="{Binding StateList}" 
          SelectedItem="{Binding StateKey, Mode=TwoWay}"
          Width="100" />
</StackPanel>

Why won’t the combobox in the DG display the values from the StateList property? Any why does the separate combobox work properly?

Answer 1

It’s not working because your ComboBox is looking for StateList as a property of the DataContext of the DataGrid. That is, it’s trying to bind to ViewModel.AddressCollectionViewSource.View.StateList when it needs to be binding to ViewModel.StateList. Check your output window while debugging and I bet you’ll see a binding error to the effect of Could not find property StateList on object AddressCollectionViewSource (or maybe ICollection).

Try this instead:

<ComboBox Name="cboState2" 
      SelectedValuePath="StateKey" 
      ItemTemplate="{StaticResource dtStateTemplate}" 
      ItemsSource="{Binding RelativeSource={RelativeSource FindAncestor,
            AncestorType={x:Type DataGrid}}, Path=DataContext.StateList}"  
      SelectedItem="{Binding StateKey, Mode=TwoWay}" 
      Width="100" />