WPF Databinding ContextMenu of Button inside a DataTemplate inside an ItemsControl

Question

I am trying to figure out how I can bind the ContextMenu of the Button that is being added in the ItemsControl I have. Basically, I\'m wanting to be able to right click on a

Answer 1

I had basically a similar problem, and the solution I found was to use the Messenger class some MVVM frameworks like Devexpress or Mvvm Light have.

Basically you can register in a viewModel to listen for incoming messages. The class itself, at least in the Devexpress implementation works with weak references, so you may not even unregister message handlers and it will not cause memory leaks.

I had used this method for removing on right click tabs from a ObservableCollection, so it was similar to your scenario.

You can have a look here :

https://community.devexpress.com/blogs/wpf/archive/2013/12/13/devexpress-mvvm-framework-interaction-of-viewmodels-messenger.aspx

and here :

https://msdn.microsoft.com/en-us/magazine/jj694937.aspx

Answer 2

Using WPF: Binding a ContextMenu to an MVVM Command as an introduction to what Tags can do, I figured out how to do what I was looking for by using multiple Tags to save the Context of what I was looking for.

I first made sure to give my window a x:Name

<Window x:Name="MainSettingsWindow"

Next, on the Button inside my DataTemplate of my ItemsControl, I set a Tag and set it to my Window

<ItemsControl ItemsSource="{Binding MyPresets}">
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <Button Width="70" Content="{Binding Name}" Tag="{Binding ElementName=MainSettingsWindow}">

Next, in the ContextMenu, I seth the DataContext of the ContextMenu to the Tag I set on the Button, I also needed to create a Tag on the ContextMenu and point it back to the Content Property of the Button so that I can pass that into the CommandParameter

<ContextMenu DataContext="{Binding Path=PlacementTarget.Tag, RelativeSource={RelativeSource Mode=Self}}" Tag="{Binding PlacementTarget.Content, RelativeSource={RelativeSource Mode=Self}}">

At this point, I can now bind my MenuItem correctly using the Command from my ViewModel and the Content Property from the Button

This is the final XAML for my ItemsControl:

<ItemsControl ItemsSource="{Binding MyPresets}">
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <StackPanel Orientation="Horizontal"/>
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <Button Width="70" Content="{Binding Name}" Tag="{Binding ElementName=MainSettingsWindow}">
                <Button.ContextMenu>
                    <ContextMenu DataContext="{Binding Path=PlacementTarget.Tag, RelativeSource={RelativeSource Mode=Self}}" Tag="{Binding PlacementTarget.Content, RelativeSource={RelativeSource Mode=Self}}">
                        <MenuItem Header="Remove" 
                                  Style="{StaticResource PopupMenuItem}"
                                  Command="{Binding Path=DataContext.RemoveCommand}"
                                  CommandParameter="{Binding Path=Tag, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=ContextMenu}}"/>
                    </ContextMenu>
                </Button.ContextMenu>
            </Button>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>

One thing to note is that I had to change the CommandParameter on my ViewModel to take an Object instead of a String. The reason I did this was because I was getting an exception on the CanExecute method in my DelegateCommand

This is the exception I was getting:

Unable to cast object of type 'MS.Internal.NamedObject' to type 'System.String'.

I'm not sure exactly what's causing that exception to throw, but changing it to Object works ok for me.