Click here to Skip to main content
13,598,210 members
Rate this:
Please Sign up or sign in to vote.
See more:
Hello, all

i'm using WPF and MVVM pattern and I try to create closeable tabitem control. But my binded method CloseCommand on the button in template of the tabitem doesn't work. And works on any button in the window. I dont understand, why? Below code of the test project.


namespace CloseableTabControl.ViewModel
    public class CloseableTabControlVM
        private RelayCommand _closeCommand;
        public ICommand CloseCommand
            get {
                if (_closeCommand == null )
                _closeCommand = new RelayCommand(param => this.closeButton_Execute());

                return _closeCommand;
        private ObservableCollection<IPageBase> _pages;

        public ObservableCollection<IPageBase> Pages
            get { return _pages; }
            set { _pages = value; }

        public CloseableTabControlVM()
            _pages = new ObservableCollection<IPageBase>();
            _pages.Add(new TabItem1VM());
            _pages.Add(new TabItem2VM());
            _pages.Add(new TabItem1VM());

        private bool closeButton_canExecute() { return true; }

        private void closeButton_Execute() 
            MessageBox.Show("Click me!");

namespace CloseableTabControl.Command
    public class RelayCommand : ICommand

        #region Fields
        private readonly Predicate<object> _canExecute;
        private readonly Action<object> _execute;

        #region Constructor
        public RelayCommand(Action<object> execute):this(null, execute) { }

        public RelayCommand(Predicate<object> canExecute, Action<object> execute)
            if (execute == null) throw new ArgumentNullException("execute");
            _execute = execute;
            _canExecute = canExecute;

        public bool CanExecute(object param)
            return _canExecute == null ? true : _canExecute(param); 

        public void Execute(object param)

        public event EventHandler CanExecuteChanged
            add { CommandManager.RequerySuggested += value; }
            remove { CommandManager.RequerySuggested -= value; }

MainWindow Code
namespace CloseableTabControl
    public partial class MainWindow : Window
        private CloseableTabControlVM _closeTab;
        public CloseableTabControlVM CloseTab
            get { return _closeTab; }
            set { _closeTab = value; }

        public MainWindow()
            _closeTab = new CloseableTabControlVM();

And MainVindow XAML
<Window x:Class="CloseableTabControl.MainWindow"






        DataContext="{Binding CloseTab,ElementName=MainWindowInstance}"

        Title="MainWindow" Height="350" Width="525">
        <DataTemplate DataType="{x:Type vm:TabItem1VM}">
        <DataTemplate DataType="{x:Type vm:TabItem2VM}">






            ItemsSource="{Binding Pages}">
                <Style TargetType="TabItem">
                    <Setter Property="HeaderTemplate">
                                <StackPanel Orientation="Horizontal">
                                    <TextBlock Text="{Binding Header}"/>
                                    <Button Content="x" Margin="0" Command="{Binding CloseCommand}" Width="16" Height="16"/>
Posted 31-Jan-13 2:47am

1 solution

Rate this: bad
Please Sign up or sign in to vote.

Solution 1

If you look in your Output window when debugging, you'll see that you have binding errors in there relating to the CloseCommand, stating that it doesn't belong to the relevant VM. That's because your command isn't defined at the VM level - rather, it's defined at the container level. To fix this, use the relative source to find the tab item that contains this - and bind to that DataContext, like this:
<Button Content="x" Margin="0" Command="{Binding DataContext.CloseCommand, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Width="16" Height="16"/>
Andrey A. Eroshenko 31-Jan-13 10:55am
Thank you. It helped
Sergey Alexandrovich Kryukov 31-Jan-13 11:10am
Sure, a 5.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

  Print Answers RSS
Top Experts
Last 24hrsThis month

Advertise | Privacy | Cookies | Terms of Service
Web03-2016 | 2.8.180621.3 | Last Updated 31 Jan 2013
Copyright © CodeProject, 1999-2018
All Rights Reserved.
Layout: fixed | fluid

CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100