Intersoft ClientUI Documentation
How-to: Handle Button Action using Delegate Command and Command Parameter (MVVM)
Intersoft ClientUI 8 > ClientUI Fundamentals > MVVM Pattern Overview > MVVM Pattern How-to Topics > How-to: Handle Button Action using Delegate Command and Command Parameter (MVVM)

This example shows how to create DelegateCommand in the ViewModel and bind it to UXButton's Command in the View.

Example

Description

The following shows the EditorViewModel with NewAction and SaveAction DelegateCommand.

In the sample, there are three UXButton that bind to the DelegateCommand. The New UXButton bind to NewAction  DelegateCommand. The Save and Save As UXButton bind to SaveAction DelegateCommand, but with different CommandParameter. The CommandParameter is used as an information for SaveCommandAction method to run the appropriate action. SaveCommandAction is the method that will be triggered when Save or Save As UXButton is clicked.

To learn more about how to use MVVM pattern using ClientUI, see Walkthrough: Create Your First ClientUI Application using MVVM Pattern.

Code

XAML
Copy Code 
<Intersoft:UXPage.Resources>
    <ViewModels:EditorViewModel x:Key="EditorViewModel"></ViewModels:EditorViewModel>
</Intersoft:UXPage.Resources>

<Grid x:Name="LayoutRoot" DataContext="{StaticResource EditorViewModel}">
    <StackPanel Orientation="Horizontal" Height="30" VerticalAlignment="Top">
        <Intersoft:UXButton Content="New" Command="{Binding NewAction}" />
        <Intersoft:UXButton Content="Save" Command="{Binding SaveAction}" CommandParameter="SaveAction"/>
        <Intersoft:UXButton Content="Save As" Command="{Binding SaveAction}" CommandParameter="SaveAsAction"/>
    </StackPanel>
</Grid>
C#
Copy Code 
public class EditorViewModel : ViewModelBase
{
    public EditorViewModel()
    {
        this.NewAction = new DelegateCommand(NewCommandAction, CanNewAction);
        this.SaveAction = new DelegateCommand(SaveCommandAction, CanSaveAction);
    }

    public DelegateCommand NewAction { get; private set; }
    public DelegateCommand SaveAction { get; private set; }

    private bool CanNewAction(object parameter)
    {
        //this method validate whether or not the New UXBUtton is active
        //In this sample, I will keep the New UXButton to be always active
        return true;
    }

    private bool CanSaveAction(object parameter)
    {
        //this method validate whether or not the Save and Save As UXBUtton is active
        //In this sample, I will keep the Save and Save As to be always active
        return true;
    }

    private void NewCommandAction(object parameter)
    {
        //this method will be triggered when the New UXButton is clicked
        MessageBoxServiceProvider.Standalone = true;

        MessageBoxServiceProvider.Show("Execute New Action", "Information",
            Intersoft.Client.UI.Aqua.UXDesktop.MessageBoxButton.OK,
            Intersoft.Client.UI.Aqua.UXDesktop.MessageBoxImage.Information,
            null);
    }

    private void SaveCommandAction(object parameter)
    {
        //this method will be triggered when the Save or Save As UXButton is clicked
        //the parameter value is get from the CommandParameter value of Save or Save As UXButton
        MessageBoxServiceProvider.Standalone = true;

        string actionInformation = "";
        if (parameter.ToString() == "SaveAction")
            actionInformation = "Execute Save Action";
        else if (parameter.ToString() == "SaveAsAction")
            actionInformation = "Execute Save As Action";

        MessageBoxServiceProvider.Show(actionInformation, "Information",
            Intersoft.Client.UI.Aqua.UXDesktop.MessageBoxButton.OK,
            Intersoft.Client.UI.Aqua.UXDesktop.MessageBoxImage.Information,
            null);
    }
}
See Also
DelegateCommand Class

Concepts

Button Controls Overview

Other Resources

Locating the Samples in Local Installation
Walkthroughs and How-to Topics