Binding MVVM Silverlight data to upgrade

Question

I am new to MVVM and Silverlight, and I'm just trying to find a simple script.

I use MVVM Light toolkit and Silverlight 3.0 without Expression Blend.

I have a DataGrid and a DataForm bound to an observable collection in a ViewModel. I would like to bind to the RelayCommand Save() property after making changes to the data in the DataForm control and achieve this without using the code for my view.

The DataForm does not use cmd:ButtonBaseExtensions.Command , which uses MVVM Light for the usual binding of the button click command, so I'm not sure how to associate the control with my ViewModel.

Any help is appreciated!

Answer 1

I realized this shortly after posting the question. Hover over your mouse.

When using the MVVM Light Toolkit, you can snap to events using the EventToCommand function.

My Xaml looks like this:

 <UserControl x:Class="CountyBusinessDirectory.UI.MainPage" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity" xmlns:dataFormToolkit="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data.DataForm.Toolkit" xmlns:data="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data" xmlns:cmd="clr-namespace:GalaSoft.MvvmLight.Command;assembly=GalaSoft.MvvmLight" xmlns:cmdextras="clr-namespace:GalaSoft.MvvmLight.Command;assembly=GalaSoft.MvvmLight.Extras" DataContext="{Binding BusinessesViewModel, Source={StaticResource Locator}}"> <Grid x:Name="LayoutRoot" ShowGridLines="False"> <Grid.ColumnDefinitions> <ColumnDefinition Width="2*"/> <ColumnDefinition Width="*"/> </Grid.ColumnDefinitions> <data:DataGrid x:Name="dgAllBusinesses" CanUserSortColumns="True" IsReadOnly="True" AutoGenerateColumns="True" ItemsSource="{Binding Businesses}" Grid.Column="0"> </data:DataGrid> <ScrollViewer x:Name="svScroll" Grid.Column="1" > <dataFormToolkit:DataForm x:Name="dfDetails" ItemsSource="{Binding Businesses}" AutoGenerateFields="True" CommitButtonContent="Save" CommandButtonsVisibility="Edit, Navigation, Commit, Cancel" > <i:Interaction.Triggers> <i:EventTrigger EventName="EditEnded"> <cmdextras:EventToCommand Command="{Binding SaveBusiness}" /> </i:EventTrigger> </i:Interaction.Triggers> </dataFormToolkit:DataForm> </ScrollViewer> </Grid> 

And my ViewModel looks like this (using the direct WCF service with Silverlight support in the ViewModel for a quick example would usually pull this into the interface for decoupling):

 //using statements ommitted for brevity namespace MyProject.ViewModels { public class BusinessesViewModel : ViewModelBase { private PagedCollectionView _businesses; DALServiceClient _proxy; public RelayCommand SaveBusiness { get; private set; } public PagedCollectionView Businesses { get { return _businesses; } set { if (_businesses != value) { _businesses = value; base.RaisePropertyChanged("Businesses"); } } } public BusinessesViewModel() { _proxy = new DALServiceClient(); //Data Access Layer WCF Service _proxy.GetBusinessesCompleted += new EventHandler<GetBusinessesCompletedEventArgs>(_proxy_GetBusinessesCompleted); _proxy.GetBusinessesAsync(); SaveBusiness = new RelayCommand(() => SaveBusinessToDB()); } private void SaveBusinessToDB() { Business bus = Businesses.CurrentItem as Business; _proxy.UpdateBusinessesAsync(bus); } void _proxy_GetBusinessesCompleted(object sender, GetBusinessesCompletedEventArgs e) { if (e.Result != null) { Businesses = new PagedCollectionView(e.Result); } } } }