Compile error in Listview XAML code related to binding

Question

I have defined in XAML a list view, see following fragment:

<Grid>
    <Button Content="_Generate List ..." Height="23" HorizontalAlignment="Right" Margin="0,0,12,12" Name="buttonGenerateLists" 
            VerticalAlignment="Bottom" Click="ButtonGenerateListsClick" Width="108" Grid.Column="1" />
    <ListView HorizontalAlignment="Stretch" Margin="275,34,13,96" Name="listViewPatches" VerticalAlignment="Stretch" SelectionMode="Extended" 
              VerticalContentAlignment="Stretch" HorizontalContentAlignment="Stretch" AlternationCount="1" GotFocus="ListViewPatchGotFocus" 
              MouseDoubleClick="{Binding Path=EditSelectedItemCommand}" SelectedItem="{Binding IsSelected}">

And I get the following compile error:

Error 1 MouseDoubleClick="{Binding Path=EditSelectedItemCommand}" is not valid. '{Binding Path=EditSelectedItemCommand}' is not a valid event handler method name. Only instance methods on the generated or code-behind class are valid. Line 12 Position 19. G:\Data\Eigen\Informatica\KorgKronosTools\KorgKronosTools\PcgWindow.xaml 12 19 PcgTools

(note: line 12 is the last line in the fragment above).

I guess I did not set the data context right, however in my code behind the following fragment is coded:

public PcgWindow(MainWindow mainWindow, string pcgFileName, PcgMemory pcgMemory)
{
    InitializeComponent();

    _mainWindow = mainWindow;
    _viewModel = new PcgViewModel(mainWindow.ViewModel);

    ...


    DataContext = _viewModel;

And I defined the binding itself in the viewmodel:

    ICommand _editSelectedItemCommand;
    public ICommand EditSelectedItemCommand
    {
        get
        {
            return _editSelectedItemCommand ?? (_editSelectedItemCommand = new RelayCommand(param => EditSelectedItem(),
                param => CanExecuteEditSelectedItem()));
        }
    }

Can someone help me to fix the compile error?

Thanks in advance.

Answer 1

You cannot bind events, only commands, you would need to specify a method name which is defined in code-behind as the error notes.

e.g.

MouseDoubleClick="OnMouseDoubleClick"

private void OnMouseDoubleClick(object sender, RoutedEventArgs e)
{
    // Do something
}

If you must use a command you can use certain libraries like Interactivity (from the Blend SDK) which allow you to execute a command when an event is fired. e.g.

<ListView ...>
    <i:Interaction.Triggers>
        <i:EventTrigger EventName="MouseDoubleClick">
            <i:InvokeCommandAction Command="{Binding EditSelectedItemCommand}" />
        </i:EventTrigger>
    </i:Interaction.Triggers>
</ListView>

Answer 2

In order to bind the double click event to a command you'll need to use Blend's interaction triggers as discussed here: WPF: How to bind a command to the ListBoxItem using MVVM?.

My example is:

<Grid>
    <Grid.Resources>
        <DataTemplate x:Key="CustomerTemplate" DataType="{x:Type ViewModel:Customer}">
            <ContentControl>
                <i:Interaction.Triggers>
                    <i:EventTrigger EventName="MouseDoubleClick">
                        <i:InvokeCommandAction Command="{Binding DoubleClickCommand}" />
                    </i:EventTrigger>
                </i:Interaction.Triggers>
                <TextBlock Text="{Binding Name}"/>
            </ContentControl>
        </DataTemplate>
    </Grid.Resources>
    <ListBox ItemsSource="{Binding Customers}" ItemTemplate="{StaticResource CustomerTemplate}" />
</Grid>


public class Customer : ViewModelBase
{
    public Customer()
    {
        DoubleClickCommand = new RelayCommand(DoubleClick);    
    }

    private void DoubleClick()
    {
        Debug.WriteLine("double click");
    }

    private string _name;

    public string Name
    {
        get { return _name; }
        set { Set(() => Name, ref _name, value); }
    }

    public ICommand DoubleClickCommand { get; private set; }
}