WPF MVVM: Find out on which header context menu has been clicked - wpf

I am trying to use the MVVM pattern to write a WPF application. I am using WPF data grid (from the toolkit) which lacks the autofiltering feature. So I want to implement it. I've added a context menu to the column header template, it has MenuItem called "Filter" which should actually call the filtering method.
So I've set a MenuItem's command to be the appropriate DelegateCommand which goes to the ViewModel. The problem is that I need to pass the information about the actual column that has been right-clicked! If I wasn't using MVVM, I would implement an event handler which would receive a "sender" argument (the MenuItem), then I would find its parent (the ContextMenu), then its parent would give me the column. But how can I achieve the same thing here? How can I pass the sender to my command? Can this be done using ComandParameter?
I really don't want to use additional complicated patterns to achieve such a simple task. After all, MVVM should simplify the development and not vice versa...

Can you pass the Column header value as a Command Parameter and use that to get the Column details at the ViewModel?

You could try some relative source magic, but it might be easier on you if you can have a different ViewModel that you bind to for each header, like HeaderViewModelItem. From there you'd just be firing a DelegateCommand in your HeaderViewModelItem, rather on your larger viewmodel.
I've used this model with pretty good success. Gets around a little bit of databinding dance.

If you want to pass something into the command parameter it is important to note that a context menu is on its own visual tree. Luckily it still inherits the DataContext from its parent, so something like
<MenuItem CommandParameter="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ContextMenu}}, Path=DataContext}" />
should get you the GridViewColumnHeader, or at least something in the visual tree of it.

Related

WPF MVVM dilemma - Where to put the command that acts on collection item?

Let's say I have the MasterViewModel that contain a collection of ItemModel. If I'd like to add new ItemModel to my collection, I'd put the AddItemCommand in that MasterViewModel. Now, if I'd like to display a Delete button next to each item, where would I put this command? Surely not in the ItemModel?!
Would I need to create almost identical copy of ItemModel, for example ItemViewModel? That would sound like a lot of prop-ing work, but even then I'm not sure how the command would be able to remove ItemModel from the collection.
Most obvious approach seems to be AddItemCommand and RemoveItemCommand in the MasterViewModel, but how to do data binding in this case? Control's DataContext is switched to a collection so I no longer have visibility of that commands from individual item level. I saw a binding trick that finds the ancestor's DataContext but that looks so hacky or not intuitive to say at least. Is this the preferred solution or there is a better approach?
AddItemCommand definitely belongs in MasterViewModel as it can't be an operation on an individual item.
RemoveItemCommand also belongs in MasterViewModel as it will update the list of items. However, the binding doesn't follow the basic methodology.
Assuming the the button that triggers the command is part of the item template, then you have to use relative binding to locate the command (is this what you referred to as 'hacky' ?)
Command="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Window}}, Path=DataContext.RemoveItemCommand}"
You have to tell the command which item is to be deleted
CommandParameter="{Binding}"
and make use of this parameter in the method corresponding to your command.

WPF databinding in child control

I am new to WPF. I'm trying to build an application which has a function (call it Initialisation) where a user has to fill in a lot of data and some parts of the form are repeated. We're rewriting a legacy app that has quite a long wizard in although we will probably use collapsible panels in one window rather than next/previous pages. Also some parts are repeated e.g. the user can specify a number of items, if they say 3 they will need to fill in some configuration info for each, so those controls would need to be repeated three times.
I'm using MVVM and am using this example here: http://msdn.microsoft.com/en-us/magazine/dd419663.aspx
The old wizard had about 4 pages so I'm intending to have one user control (Initialisation) that contains 4 child user controls to break the xaml up a bit.
So far I have the Initialisation (its ViewModel inherits from Workspace ViewModel as in the above example) and it contains one child which is working:
<Expander ExpandDirection="Down" Header="ChildOne">
<view:ChildOne />
</Expander>
I will have separate ViewModels for each child and for Intialisation and this brings me to my problem.
The problem I am having is that ChildOne contains a dropdown which I am trying to bind like so:
<ComboBox x:Name="textMessageTypeCmb" ItemsSource="{Binding Path=TextMessageSelectionOptions, Mode=OneTime}"/>
TextMessageSelectionOptions is a public property in ChildOne's ViewModel. This results in no errors but an empty dropdown - that property getter is never called. If I move that property getter code into the Initialisation's ViewModel instead it works but I'm trying to keep my code in manageable chunks so I'd like to put hat code back in ChildOne's ViewModel. It also works if in my MainWindow I create ChildOne as a workspace instead of Initialisation like this
ChildOneViewModel ws = this.Workspaces.FirstOrDefault(vm => vm is ChildOneViewModel) as ChildOneViewModel;
Can anyone advise whether I am taking the right approach (by dividing it up into several user controls) and what I need to do in the binding to make this work? I don't really understand any of this yet especially binding.
It seems to me that your ChildOne view's DataContext is still this Initialisation vm.
You can bind it the views Datacontext to a ChildOneViewModel object
...
<view:ChildOne DataContext={Binding PropertyReturnsChildOneViewModellObject/>
...
or specify the path for the combobox ItemsSource prop.
<ComboBox x:Name="textMessageTypeCmb" ItemsSource="{Binding Path=PropertyReturnsChildOneViewModellObject.TextMessageSelectionOptions, Mode=OneTime}"/>
Note: PropertyReturnsChildOneViewModellObject is a property of the Initialisation vm.

Databinding to functions in dynamically-loaded plugins

I have several MenuItems whose Commands are bound to my ViewModel. Until today, all of them execute properly.
Now I have added a MenuItem whose ItemsSource is bound to an ObservableCollection. The point of this MenuItem is to enumerate a list of plugins so that the name of all plugins show up. Then when the user clicks on a plugin name, it should call a function to display properties for audio filters.
In my current implementation, which doesn't work, I tried to databind like this:
<MenuItem Header="Filters" ItemsSource="{Binding FilterPluginNames}">
<MenuItem.ItemContainerStyle>
<Style>
<Setter Property="MenuItem.Command" Value="{Binding ShowFilterDialogCommand}" />
</Style>
</MenuItem.ItemContainerStyle>
</MenuItem>
The problem is that I get a BindingExpression path error because it's trying to use a String as the MenuItem's DataContext.
This leads me to believe that the DataContext for a MenuItem's MenuItems is automatically set to type of objects in the ItemsSource. Is this true?
If I need to change the DataContext, then I'd like to change it to the ViewModel that handles all of my other Commands. But if I do that, how in the world am I able to tell which plugin I want to display filter properties for? I'd need to pass in a CommandParameter at the very least, but binding this value to the filter name isn't my most favorite option. Are there any other ways to do this?
If the DataContext is indeed automatically set to the object type in the ObservableCollection, then I'd rather just call my interface method ShowFilterProperties() directly. I bet that I can't do this without Command binding. If that is the case, how do you all deal with this sort of application? Do you make all of the plugins expose a command handler, which will then show the dialog?
EDIT -- I modified my code to change the ObservableCollection type, and sure enough, WPF wants to databind to the type T. So I guess one option is to have the plugin expose the ICommand, but I don't know if this is a weird approach or not?
EDIT -- ok, I just learned something new. Interfaces can't have fields, so is it not possible to databind with plugins, period?
You are likely not quite binding like you think you are. You might want to just put some diagnostics on your bindings and see what object they are binding to. Here is a good link for debugging bindings:
http://www.beacosta.com/blog/?p=52
Here's a sample:
<Window …
xmlns:diagnostics="clr-namespace:System.Diagnostics;assembly=WindowsBase"
/>
<TextBlock Text="{Binding Path=Caption, diagnostics:PresentationTraceSources.TraceLevel=High}" … />
I think your approach is correct... it probably just needs to be debugged a little.

WPF DataGrid: Get column binding property for filtering

I am trying to develop a filtering functionality for WPF DataGrid (from the WPF Toolkit). I want a user to right-click any cell and select Filter from its CcontextMenu, and then the grid should be filtered by the cell's value.
I am trying the M-V-VM pattern. My windows's datacontext is MainWindowViewModel which has a property Transactions. This property returns ObservableCollection<TransactionViewModel>, and the data grid uses this collection as its items source. So basically each row is bounded to TransactionViewModel (as you can guess, this grid lists transactions). MainWindowsViewModel has ICollectionView which is used for filtering and tracking the currently selected row. The DataGrid has its property IsSynchronizedWithCurrentItem set to "true", so myCollectionView.CurrentItem gives me the currently selected TransactionViewModel.
The only thing I still need to know is by which column I need to filter. This depends on where the user clicked the context menu. So I am trying to pass this information using CommandProperty of the context menu item. And here I have a real problem. I tried this:
CommandParameter="{Binding Column.Binding.Path.Path,
RelativeSource={RelativeSource FindAncestor,
AncestorType={x:Type tk:DataGridCell}}}" />
This is really ugly, but this works for DataGridTextColumns. Unfortunately, I have also DataGridTemplateColumns, and they don't work (the path is different there, because I need to reach the actual cell template)...
So how can I implement this functionality? Perhaps the whole way is wrong? I didn't find any valuable example on that. The only thing I found is the WPF DataGrid autofilter implementation on the Codeproject which doesn't work at all for some reason...
Thank you.
I'm not 100% sure if this would help but...
DataGrid has CurrentCell so you could bind it in TwoWay mode in your MainWindowViewModel.
Then every "row" could point to DoFilter command defined in MainWindowViewModel. It's not a beauty solution (because viewmodel has to know DataGrid Cell type) but it should work.
Why not just pass the cell as a parameter like this:
CommandParameter=
"{Binding RelativeSource={RelativeSource FindAncestor,tk:DataGridCell,1}}" />
and let your command's Executed event handle all the hard part of finding the actual column name? That way you can write all the special-case code you need.

General Design Question about data binding in WPF

I'm starting to use Binding in my WPF project and I'm actually confused about few things on the presentation side (XAML).
So I want to populate a TreeView with a List of Categories. I know how to write the right HierarchicalDataTemplate for my List of Category instances.
<HierarchicalDataTemplate ItemsSource="{Binding Path=ChildrenCategories}" DataType="{x:Type src:Category}">
<TextBlock Text="{Binding Path=Name}"></TextBlock>
</HierarchicalDataTemplate>
But what now I don't know is from where to get the list. I have here 2 solutions :
I got a Library Singleton class
which return me the right
arborescence, then I need to use an
ObjectDataProvider in my xaml which
would call the
Library.Instance.Categories method. (Which means that the controller has to be completely separated from the UI).
I got a Property ListCategories
in my page interactionLogic
(OpenUnit.xaml.cs), and bind the
tree with it.
I'm not sure about the purpose of the xaml.cs files, what are they made for? Is it normally used to store the properties (and act as a controller) or simply to have a back-end for the UI (for example get values from the UI?)?
In case the xaml.cs file is used as a controller, how do I bind my data to it, I've tried many solutions without success,my only success was with the use of static binding.
I would appreciate any comment or recommandation about UI and Logic Binding in WPF, hopefully I will get less confused.
Thanks in advance,
Boris
After reading this great article, I got a little bit less confused :
http://msdn.microsoft.com/en-us/magazine/dd419663.aspx
The article is about the Model View ViewController pattern, and how WPF integrates it. So it seems that xaml.cs files should be used as the ViewController here, and should hold the properties.
It actually make sense since it's not a good practice to mix the View and the Data, we want the designers should have a completely independant work to do.
Also for the solution 2) it is possible if you set the data context to the current file.

Resources