Sometimes we need to handle the event in the view model. One simple approach is to introduce event properties in ViewModel and set it from the view as we saw in this example. Another approach is to convert event into command and use the command binding. In this method we are creating attach properties of ICommand type which calls the command whenever that event occurs.
First take a look at our program without any command binding. We are using MVVM and here is our ViewModel class.
We don’t have a separate Model class, because our data is list of string (in fact ObservableCollection of string) and we initilized it inside the ViewModel. We created one ICommand type property and create one method to handle that command. Here we are using MessageBox inside the ViewModel, which is just for simplicity purpose, in a proper ViewModel we shouldn’t have any user interface element inside ViewModel.
Our view class is very simple just create a ViewModel and assign it into DataContext.
Our implementation of ICommand interface is very simple we are not doing any fancy stuff here and just give the minimal implementation of it. Here is our ICommnad interface implementation.
If we run this program then it display the name of states in listbox (if we define listbox in XAML and set its items source property to States property of ViewModel). Now we are going to handle the Event and convert it into Command.
To do this we are going to create one class named ListBoxBehavior and define Attached dependency property in it. We already saw the attached properties here. We have to write as many attached dependency properties as many events we want to handle. In our example we are going to handle only one event.
In next step we are going to add two fields in this class one for dependency property type and other for routed event.
Note that the event we want to handle is stored in our field, in our example it is SelectionChanged event define in the base class of ListBox. Then we are going to define the PropertyMetaData for Attached property. The main reason to define meta data is to define the callback method. Here is updated version of our program now.
This callback method perform the trick. This callback function add the event handler for our event which calls whenever that event occurs and that handler is going to call our command method. Here is our callback method.
This callback method register one method name EventHandler. Inside our EventHandler method we are getting the command from the dependency property (which we set from the XAML) and execute the command. Here is a code of our EventHandler.
Here is our XAML code, which is quite straight forward.
In XAML we are using the attach dependency property of ListBoxBehavior class and assign our ICommand property to it and perform command binding.
Here is our complete C# code.
Now whenever we change the selection in list box it will display a message box with the value of newly selected item. The only violation of MVVM in this example is using MessageBox inside the ViewModel, but that is just for illustration purpose, we can do other useful stuff inside that method.