Binding Context menu to ViewModel which is not in context's Visuals tree

Question

I have a TreeView whose itemsource is a collection of my Model class. I have added a context menu on the treeView. Since the commands of the contextMenu should be in the visual tree, so I had to place them in my Model class. Which is wrong (Binding directory to the Model).

How can I Bind my context menu's Command to my ViewModel rather than Model?

Here is my XAML code for TreeView.

 <TreeView ItemsSource="{Binding DigSource}" Tag="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type UserControl}}}">
                    <TreeView.ItemContainerStyle >
                        <Style TargetType="{x:Type TreeViewItem}">
                            <Setter Property="ContextMenu">
                                <Setter.Value>
                                    <ContextMenu >
                                        <MenuItem Header="Edit" CommandParameter="{Binding }"
                                            Command="{Binding Path=PlacementTarget.Tag.DataContext.MyCommand, 
                                            RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=ContextMenu}}" />
                                    </ContextMenu>
                                </Setter.Value>
                            </Setter>
                        </Style>
                    </TreeView.ItemContainerStyle >
                    <TreeView.ItemTemplate>
                        <HierarchicalDataTemplate ItemsSource="{Binding SingleDig}">
                            <StackPanel Orientation="Horizontal">
                                <TextBlock Text="{Binding Name}"/>
                            </StackPanel>
                            <HierarchicalDataTemplate.ItemTemplate>
                                <DataTemplate DataType="{x:Type dt:MultiDig}">
                                    <StackPanel Orientation="Horizontal">
                                        <TextBlock Text="{Binding Name}"/>
                                    </StackPanel>
                                </DataTemplate>
                            </HierarchicalDataTemplate.ItemTemplate>
                        </HierarchicalDataTemplate>
                    </TreeView.ItemTemplate>
                </TreeView>

and ViewModel's Icommand Property is

    private ICommand _editMenuCommand;
    /// <summary>
    /// Edit command
    /// </summary>
    public ICommand EditMenuCommand { get { return _editMenuCommand ?? (_editMenuCommand = new RelayCommand(EditMenu)); } }

    /// <summary>
    /// Edit menu
    /// </summary>
    public void EditMenu()
    {
        MessageBox.Show("Edit me");
    }

Thanks in advance.

what is the issue with this code? command not firing?

Nitin Purohit
– Nitin Purohit

2013-09-18 17:52:53 +00:00
Commented Sep 18, 2013 at 17:52 — Nitin Purohit
– Nitin Purohit, Commented Sep 18, 2013 at 17:52

Nitin Purohit · Accepted Answer · 2013-09-18 18:08:17Z

3

Here is your ItemContainerStyle with updated bindings.. Tested this at my end and it works well.

<TreeView ItemsSource="{Binding DigSource}">
    <TreeView.ItemContainerStyle >
          <Style TargetType="{x:Type TreeViewItem}">
               <Setter Property="Tag" Value="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type UserControl}}}"/>
               <Setter Property="ContextMenu">
                   <Setter.Value>
                       <ContextMenu >
                            <MenuItem Header="Edit" CommandParameter="{Binding PlacementTarget.DataContext, RelativeSource={RelativeSource AncestorType={x:Type ContextMenu}}}"
                                                Command="{Binding Path=PlacementTarget.Tag.DataContext.MyCommand, 
                                                RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=ContextMenu}}" />
                         </ContextMenu>
                    </Setter.Value>
                  </Setter>
         </Style>
   </TreeView.ItemContainerStyle >

answered Sep 18, 2013 at 18:08

Nitin Purohit

18.6k2 gold badges39 silver badges53 bronze badges

Sign up to request clarification or add additional context in comments.

10 Comments

WAQ Over a year ago

The problem is I dont know whether its a Parent Item for which the command was called or a child item. I have only two hirarchies. A Parent can have multiple children, and there can b n parents items. So I need to know for which item, the context menu's command is called.

WAQ Over a year ago

yesterday you said "send item in command parameter like Binding=PlacementTarget.DataContext", I did it but I dont know how do I receive the item in my viewModel

Nitin Purohit Over a year ago

yes.. the answer i provided above does the same.. now we have context menu on the treeviewitem..it can be any treeviewitem (parent or child) and will be PlacementTarget for the contextmenu... so when we are saying PlacementTarget.DataContext it means the model backing the treeviewitem.. thats why you got that in commmand param

WAQ Over a year ago

I gotcha. But At a time, its either a parent item's command executing or a child's. How do I know which one is it?

Nitin Purohit Over a year ago

you have parent and child of different types rt? so by the type of the item you get in command parameter you can figure out if it was child or parent

|

Collectives™ on Stack Overflow

Binding Context menu to ViewModel which is not in context's Visuals tree

1 Answer 1

10 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

10 Comments

Your Answer

Sign up or log in

Post as a guest

Related