在不同DataContext中具有两个组合框的MultiBinding

Question

I have the following datagrid that contains two comboboxes each contained in a data template.

<DataGrid x:Name="FilterSelection" HorizontalAlignment="Stretch">

    <DataGrid.Resources>
        <DataTemplate x:Key="EntityComboboxTemp">
            <ComboBox x:Name="EntityCombobox"
                ItemsSource="{Binding DataContext.FilterVehicleEntities, RelativeSource={RelativeSource AncestorType=local:ExportView}}">
                <i:Interaction.Triggers>
                    <i:EventTrigger EventName="SelectionChanged">
                        <i:InvokeCommandAction 
                            Command="{Binding DataContext.SelectedEntityCommand, RelativeSource={RelativeSource AncestorType=local:ExportView}}"
                            CommandParameter="{Binding ElementName=EntityCombobox, Path=SelectedItem}">
                        </i:InvokeCommandAction>
                    </i:EventTrigger>
                </i:Interaction.Triggers>
            </ComboBox>
        </DataTemplate>


        <DataTemplate x:Key="AttributeComboboxTemp">
            <ComboBox x:Name="AttributeCombobox"
                ItemsSource="{Binding DataContext.FilterAttributes, RelativeSource={RelativeSource AncestorType=local:ExportView}}">
                <i:Interaction.Triggers>
                    <i:EventTrigger EventName="SelectionChanged">
                        <i:InvokeCommandAction 
                            Command="{Binding DataContext.SelectedAttributeCommand, RelativeSource={RelativeSource AncestorType=local:ExportView}}">
                            <i:InvokeCommandAction.CommandParameter>
                                <MultiBinding Converter="{conv:FilterMultipleConverter}">
                                    <Binding ElementName="EntityCombobox" Path="SelectedItem"/>
                                    <Binding ElementName="AttributeCombobox" Path="SelectedItem"/>
                                </MultiBinding>
                            </i:InvokeCommandAction.CommandParameter>
                        </i:InvokeCommandAction>
                    </i:EventTrigger>
                </i:Interaction.Triggers>
            </ComboBox>
        </DataTemplate>
    </DataGrid.Resources>


    <DataGrid.Columns>
        <DataGridTemplateColumn Header="Entity" CellTemplate="{StaticResource EntityComboboxTemp}" />
        <DataGridTemplateColumn Header="Entity Attribute" CellTemplate="{StaticResource AttributeComboboxTemp}"/>
    </DataGrid.Columns>
</DataGrid>

The problem lies in the multiple binding of the second combobox, namely the line:

Binding ElementName="EntityCombobox" Path="SelectedItem"/>

which should bind the selecteditem of the first combobox to the second combobox as commandparameter. But I always get the Data binding error that EntityCombobox is unknown. How can I set the DataContext for this binding, is this even possible?

Answer 1

My suggestion is to not do so much in your view. I would recommend to do this logic in the ViewModel for the DataGrid.

To start then I would create a view model for holding your filter selections.

Example: (please see comments for where to put logic for selection changes)

public class FilterViewModel
{
    private string _vehicleEntity;
    public string VehicleEntity
    {
        get { return _vehicleEntity; }
        set
        {
            _vehicleEntity = value;
            //OnPropertyChanged() if you want
        }
    }

    private string _attribute;
    public string Attribute
    {
        get { return _attribute; }
        set
        {
            _attribute = value;
            //Add logic here to determine what to do with both Attribute and VehicleEntity
            //OnPropertyChanged() if you want
        }
    }
}

Then setup your overall View's ViewModel to hold a collection of the FilterModel along with the list of Vehicle options and Attribute options.

Example:

public class MainWindowViewModel
{
    public ObservableCollection<FilterViewModel> Rows { get; }
    public ObservableCollection<string> FilterVehicleEntities { get; }
    public ObservableCollection<string> FilterAttributes { get; set; }

    public MainWindowViewModel()
    {
        Rows = new ObservableCollection<FilterViewModel>();

        FilterVehicleEntities = new ObservableCollection<string>()
        {
            "Vehicle 1",
            "Vehicle 2",
            "Vehicle 3",
        };

        FilterAttributes = new ObservableCollection<string>()
        {
            "Attribute 1",
            "Attribute 2",
            "Attribute 3",
        };
    }
}

Then make your view less complicated by just directly binding the selection to the properties. You will then get notified of selection changes as soon as the property updates (as marked in the comments for the FilterViewModel).

Example (full xaml):

<Window x:Class="WpfApp1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp1"
        mc:Ignorable="d"
        Title="MainWindow"
        Width="600"
        Height="500">
    <Window.DataContext>
        <local:MainWindowViewModel />
    </Window.DataContext>
    <Grid>
        <DataGrid
            AutoGenerateColumns="False"
            ItemsSource="{Binding Rows}">
            <DataGrid.Columns>
                <DataGridComboBoxColumn
                    Header="Entity"
                    SelectedItemBinding="{Binding VehicleEntity, UpdateSourceTrigger=PropertyChanged}">
                    <!-- property changed so we get the change right after we select-->
                    <DataGridComboBoxColumn.ElementStyle>
                        <Style
                            TargetType="ComboBox">
                            <Setter
                                Property="ItemsSource"
                                Value="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Window}}, Path=DataContext.FilterVehicleEntities}" />
                        </Style>
                    </DataGridComboBoxColumn.ElementStyle>
                    <DataGridComboBoxColumn.EditingElementStyle>
                        <Style
                            TargetType="ComboBox">
                            <Setter
                                Property="ItemsSource"
                                Value="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Window}}, Path=DataContext.FilterVehicleEntities}" />
                        </Style>
                    </DataGridComboBoxColumn.EditingElementStyle>
                </DataGridComboBoxColumn>

                <DataGridComboBoxColumn
                    Header="Entity Attribute"
                    SelectedItemBinding="{Binding Attribute, UpdateSourceTrigger=PropertyChanged}">
                    <!-- property changed so we get the change right after we select-->
                    <DataGridComboBoxColumn.ElementStyle>
                        <Style
                            TargetType="ComboBox">
                            <Setter
                                Property="ItemsSource"
                                Value="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Window}}, Path=DataContext.FilterAttributes}" />
                        </Style>
                    </DataGridComboBoxColumn.ElementStyle>
                    <DataGridComboBoxColumn.EditingElementStyle>
                        <Style
                            TargetType="ComboBox">
                            <Setter
                                Property="ItemsSource"
                                Value="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Window}}, Path=DataContext.FilterAttributes}" />
                        </Style>
                    </DataGridComboBoxColumn.EditingElementStyle>
                </DataGridComboBoxColumn>
            </DataGrid.Columns>
        </DataGrid>
    </Grid>
</Window>

Answer 2

A ComboBox in a DataTemplate cannot refer to a ComboBox that is defined somewhere else using an ElementName binding because they are not in the same namescope .

What you should do is to bind the SelectedItem property of the EntityCombobox to a source property, and then bind the CommandParameter property of the other ComboBox to the same source property. For this to work, the class where the source property is defined must implement the INotifyPropertyChanged interface and raise change notifications and both ComboBoxes must also share the same DataContext .