Reputation: 31
I am trying to set up context menus within a treeview based on an hierarchicaldatatemplate in MVVM. The root is a parent viewmodel that has nested viewmodels inside in a observable collection and so on. The root is based in my main viewmodel
Example:
What I try to do is to set up a context menu on a Grand Child called "Delete". The Problem I have is how do I set up the command within the context menu when it is located in the viewmodel of the child? Because all Grand childs are stored within a observablecollection in the child viewmodel. I tried several solution published here but nothing worked for me.
What I tried until now:
But I am getting the Error:
Cannot find source for binding with reference 'RelativeSource FindAncestor, AncestorType='SimTableApplication.View.Controls.VirtualControllerView', AncestorLevel='1''. BindingExpression:(no path); DataItem=null; target element is 'StackPanel' (Name=''); target property is 'Tag' (type 'Object')
Here is my xaml code of the treeview:
<TreeView Name="Tree" ItemsSource="{Binding Projects}" Background="#cccccc" BorderThickness="0" >
<i:Interaction.Behaviors>
<behav:TreeViewSelectedItemBehavior SelectedItem="{Binding SelectedTreeViewItem}"/>
</i:Interaction.Behaviors>
<TreeView.Resources>
<Style TargetType="TreeViewItem">
<Setter Property="IsExpanded" Value="True"/>
<Setter Property="Foreground" Value="White"/>
<Setter Property="FontWeight" Value="Bold"/>
<Setter Property="Background" Value="Transparent"/>
<EventSetter Event="MouseRightButtonDown" Handler="TreeViewItem_MouseRightButtonDown"/>
</Style>
</TreeView.Resources>
<TreeView.ItemTemplate>
<HierarchicalDataTemplate ItemsSource="{Binding VirtualPLCs}">
<StackPanel Orientation="Horizontal">
<Image Source="/SimTableApplication;component/Assets/ICO_PE_Project.ico" Height="18" Width="18"/>
<TextBlock Text="{Binding ProjModel.ProjectName}" Margin="3"/>
<StackPanel.ContextMenu>
<ContextMenu>
<MenuItem Header="Add new Controller" Command="{Binding AddNewControllerCommand}">
<MenuItem.Icon>
<Image Source="/SimTableApplication;component/Assets/ICO_PE_CreateNewItem.ico"/>
</MenuItem.Icon>
</MenuItem>
<Separator />
<MenuItem Header="Properties" Command="{Binding ShowProjectPropertiesCommand}">
<MenuItem.Icon>
<Image Source="/SimTableApplication;component/Assets/ICO_PVS_Properties.png"/>
</MenuItem.Icon>
</MenuItem>
</ContextMenu>
</StackPanel.ContextMenu>
</StackPanel>
<HierarchicalDataTemplate.ItemTemplate>
<HierarchicalDataTemplate ItemsSource="{Binding SimTables}">
<StackPanel Orientation="Horizontal">
<Image Source="/SimTableApplication;component/Assets/ICO_PE_Device.ico" Height="18" Width="18"/>
<TextBlock Text="{Binding Name}" Margin="3"/>
<StackPanel.ContextMenu>
<ContextMenu>
<MenuItem Header="Add new SIM table" Command="{Binding AddNewSimTableCommand}">
<MenuItem.Icon>
<Image Source="/SimTableApplication;component/Assets/ICO_PE_CreateNewItem.ico"/>
</MenuItem.Icon>
</MenuItem>
<Separator />
<MenuItem Header="Power On" Command="{Binding PowerOnCommand}">
<MenuItem.Icon >
<Image Source="/SimTableApplication;component/Assets/ICO_PLCSIM_Tbon.ico "/>
</MenuItem.Icon>
</MenuItem>
<MenuItem Header="Power Off" Command="{Binding PowerOffCommand}">
<MenuItem.Icon >
<Image Source="/SimTableApplication;component/Assets/ICO_PLCSIM_Tboff.ico "/>
</MenuItem.Icon>
</MenuItem>
<MenuItem Header="Run" Command="{Binding RunCommand}">
<MenuItem.Icon >
<Image Source="/SimTableApplication;component/Assets/StartSimulation.png"/>
</MenuItem.Icon>
</MenuItem>
<MenuItem Header="Stop" Command="{Binding StopCommand}">
<MenuItem.Icon >
<Image Source="/SimTableApplication;component/Assets/StopSimulation.png"/>
</MenuItem.Icon>
</MenuItem>
<MenuItem Header="MRES" Command="{Binding ResetMemoryCardCommand}">
<MenuItem.Icon >
<Image Source="/SimTableApplication;component/Assets/reset-icon.png"/>
</MenuItem.Icon>
</MenuItem>
<Separator />
<MenuItem Header="Delete">
<MenuItem.Icon>
<Image Source="/SimTableApplication;component/Assets/ICO_PE_TbDelete.ico"/>
</MenuItem.Icon>
</MenuItem>
</ContextMenu>
</StackPanel.ContextMenu>
</StackPanel>
<HierarchicalDataTemplate.ItemTemplate >
<DataTemplate >
<StackPanel Orientation="Horizontal" **Tag="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type UserControl}}}">**
<Image Source="/SimTableApplication;component/Assets/ICO_PLCS_SimTable.ico" Height="18" Width="18"/>
<TextBlock Text="{Binding SimTableName}" Margin="3"/>
<StackPanel.ContextMenu>
<ContextMenu>
<MenuItem Header="Delete" Command="{Binding Path=PlacementTarget.Tag.DataContext.DeleteSimTableCommand,
RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=ContextMenu}}">
<MenuItem.Icon>
<Image Source="/SimTableApplication;component/Assets/ICO_PE_TbDelete.ico"/>
</MenuItem.Icon>
</MenuItem>
</ContextMenu>
</StackPanel.ContextMenu>
</StackPanel>
</DataTemplate>
</HierarchicalDataTemplate.ItemTemplate>
</HierarchicalDataTemplate>
</HierarchicalDataTemplate.ItemTemplate>
</HierarchicalDataTemplate>
</TreeView.ItemTemplate>
</TreeView>
Maybe somebody can give me a hint what I am doing wrong.
Upvotes: 3
Views: 2840
Reputation: 12276
I think your problem is because you're trying to do relativesource binding as well as placementtarget at the same time. I don't think I've ever managed to get that to work as expected. What I usually do is bind the tag of the placementtarget to wherever I'm going to get commands from and then I can get to that. This could be a problem if you had other commands in that contextmenu, but you don't. I don't have all your code so I threw something together with just two levels - parent and child. Child is the leaf and parent is equivalent to where your delete command will be. This works for me:
<Window.DataContext>
<local:MainWindowViewModel/>
</Window.DataContext>
<Grid>
<TreeView ItemsSource="{Binding Parents}">
<TreeView.Resources>
<HierarchicalDataTemplate DataType="{x:Type local:Parent}" ItemsSource="{Binding Children}">
<TextBlock Text="{Binding Name}" />
</HierarchicalDataTemplate>
<DataTemplate DataType="{x:Type local:Child}">
<StackPanel Tag="{Binding DataContext,
RelativeSource={RelativeSource AncestorType=TreeViewItem , AncestorLevel=2}
}"
>
<StackPanel.ContextMenu>
<ContextMenu DataContext="{Binding Path=PlacementTarget.Tag,
RelativeSource={x:Static RelativeSource.Self}}">
<MenuItem Header="Delete" Command="{Binding DeleteCommand}">
</MenuItem>
</ContextMenu>
</StackPanel.ContextMenu>
<TextBlock Text="{Binding ChildName}"/>
</StackPanel>
</DataTemplate>
</TreeView.Resources>
</TreeView>
</Grid>
The tag is in the visual tree so it can do the relativesource thing OK and then the command is in the Tag of the placement target. If that's not clear, I can publish the sample.
A keybinding on delete would be simpler, I guess that's no good to you though.
Upvotes: 0