ItemsControl button click command

Question

I need some quick help which is a road blocker for me now. I have Button in ItemsControl and I need to perform some task on Button click. I tried adding Command to Button in ItemsControl DataTemplate but its not working. Can anyone suggest how to proceed further.

<UserControl.Resources>
    <DataTemplate x:key="mytask">
        <TextBox Grid.Row="5" Grid.Column="2" Text="{Binding Path=PriorNote}" Grid.ColumnSpan="7"  VerticalAlignment="Center" HorizontalAlignment="Left" Margin="0,5" Width="505" Foreground="Black"/>
        <StatusBarItem Grid.Row="2" Grid.Column="8" Margin="8,7,7,8" Grid.RowSpan="2">
        <Button x:Name="DetailsButton" Command="{Binding CommandDetailsButtonClick}">
    </DataTemplate>
</UserControl.Resources>

<Grid>
    <ItemsControl Grid.Row="1" 
                  ItemsSource="{Binding ListStpRules}" 
                  ItemTemplate="{StaticResource myTaskTemplate}" Background="Black"
                  AlternationCount="2" >
    </ItemsControl>
</Grid>

and in ViewModel I have implemented code for Command. And its not working. Please suggest any solution for me to proceed further

score 24 · Answer 1 · edited Feb 01 '13 at 21:40

24

The DataContext of each item in your ItemsControl is the item in the collection the ItemsControl is bound to. If this item contains the Command, your code should work fine.

However, this is not usually the case. Typically there is a ViewModel containing an ObservableCollection of items for the ItemsControl, and the Command to execute. If this is your case, you'll need to change the Source of your binding so it looks for the command in ItemsControl.DataContext, not ItemsControl.Item[X]

<Button Command="{Binding 
    RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}, 
    Path=DataContext.MyCommand}" />

edited Feb 01 '13 at 21:40

Dave Clemmer

3,741
12
49
72

answered Mar 15 '12 at 13:39

Rachel

130,264
66
304
490

5

Adding to Rachel's good answer, if you want to pass item as parameter, use CommandParameter="{Binding}"... – isntn Jun 03 '12 at 07:46
+1 This worked perfectly for me! I actually needed to bind to a `Command` in the View and not ViewModel, so I used: `{Binding RelativeSource={RelativeSource AncestorType={x:Type UserControl}}, Path=MyCommand}` instead =] – newfurniturey Aug 14 '12 at 19:49

score 0 · Answer 2 · edited Feb 01 '13 at 21:40

If your ViewModel has a property of type ICommand you can bind the Button's Command property to that:

XAML:

<DataTemplate DataType="{x:Type my:FooViewModel}">
   <Button Content="Click!" Command="{Binding Path=DoBarCommand}" />
</DataTemplate>

C#:

public sealed class FooViewModel
{
  public ICommand DoBarCommand
  {
    get;
    private set;
  }
  //...
  public FooViewModel()
  {
     this.DoBarCommand = new DelegateCommand(this.CanDoBar, this.DoBar);
  }
}

score 0 · Answer 3 · edited Feb 01 '13 at 21:40

0

Read this:

http://msdn.microsoft.com/en-us/magazine/dd419663.aspx

Implement a class similar to RelayCommand in the above article. Would make your further MVVM coding easier. :-)

edited Feb 01 '13 at 21:40

Dave Clemmer

3,741
12
49
72

answered Mar 15 '12 at 08:59

Sreedharlal B Naick

156
7

score 0 · Answer 4 · edited Feb 01 '13 at 21:40

Just a guess. Is CommandDetailsButtonClick defined in a ViewModel, which is DataContext of your UserControl (the one with ListStpRules property)?

DataContext of button in ItemTemplate is an item from ListStpRules, and if you command is not there then binding won't find it.

You can check diagnostic messages from wpf in Output window while debugging your application. It writes there if it can not resolve binding.

ItemsControl button click command

4 Answers4

Linked