How do I bind IsChecked property of CheckBox within an ItemsControl?

Question

I've got the following ItemsControl that gives me a check box for every database within the available collection. These checkboxes allow the user to select which ones to filter on. The databases to filter on are in a separate collection (FilteredDatabases). How exactly do I do this? I could add an InFilter property to the database item class. But, I don't want to start changing this code yet. The problem I can't get around in my head is the fact that I need to bind to a property that is not on the database item itself. Any ideas?

<ItemsControl ItemsSource="{Binding AvailableDatabases}">
   <ItemsControl.ItemTemplate>
      <DataTemplate>
         <CheckBox Content="{Binding Name}" IsChecked="{Binding ???}"/>
      </DataTemplate>
   </ItemsControl.ItemTemplate>
</ItemsControl>

// In view model

public IBindingList FilteredDatabases
{
  get;
  private set;  
}

public IBindingList AvailableDatabases
{
   get;
   private set;
}

You need to add a property on your viewmodel, you will use the setter of this property to add or remove the checked database from the FilteredDatabases collection — jimmyjambles, Jun 18 '12 at 23:10
The problem is that I don't know which item was checked within my items control. How do I get that to my view model? — bsh152s, Jun 19 '12 at 12:20

score 0 · Answer 1 · answered Jun 19 '12 at 00:23

0

Bind CheckBox.Command to routed command instance
Bind routed command to method
Use IBindingList.Add and IBindingList.Remove methods

answered Jun 19 '12 at 00:23

Aleksandr Vishnyakov

1,872
5
23
39

That got me a little further. Checking/unchecking the box now adds/removes the items from the filtered collection. However, how do I get the view initialized so that when first displaying the form, the databases in the filtered collection are checked. Again, I'd like to do this with binding/MVVM. – bsh152s Jun 19 '12 at 11:37

score 0 · Answer 2 · answered Jun 19 '12 at 18:48

The following code illustrates what you are trying to do, in order to do this you are better off using ObservableCollection instead of as your collection object, if an ItemsControl is bound to it it will automatically update the UI when viewmodels are added and removed.

XAML:

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition />
        <ColumnDefinition />
    </Grid.ColumnDefinitions>
    <ItemsControl Grid.Column="0" ItemsSource="{Binding AvailableDatabases}">
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <CheckBox Content="{Binding Name}" IsChecked="{Binding IsChecked}"/>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>
    <ItemsControl Grid.Column="1" ItemsSource="{Binding FilteredDatabases}">
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <TextBlock Text="{Binding Name}" />
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>
</Grid>

View Models:

public class MainViewModel
{
    private ObservableCollection<DBViewModel> _availableDatabases;
    private ObservableCollection<DBViewModel> _filteredDatabases;

    public ObservableCollection<DBViewModel> AvailableDatabases
    {
        get
        {
            if (_availableDatabases == null)
            {
                _availableDatabases = new ObservableCollection<DBViewModel>(new List<DBViewModel>()
                    {
                        new DBViewModel(this) { Name = "DB1" , IsChecked = true},
                        new DBViewModel(this) { Name = "DB2" },
                        new DBViewModel(this) { Name = "DB3" },
                        new DBViewModel(this) { Name = "DB4" },
                        new DBViewModel(this) { Name = "DB5" },
                        new DBViewModel(this) { Name = "DB6" },
                        new DBViewModel(this) { Name = "DB7" , IsChecked = true },
                    });


            }
            return this._availableDatabases;
        }
    }

    public ObservableCollection<DBViewModel> FilteredDatabases
    {
        get
        {
            if (_filteredDatabases == null)
                _filteredDatabases = new ObservableCollection<DBViewModel>(new List<DBViewModel>());

            return this._filteredDatabases;
        }
    }
}

public class DBViewModel
{
    private MainViewModel _parentVM;
    private bool _isChecked;

    public string Name { get; set; }

    public DBViewModel(MainViewModel _parentVM)
    {
        this._parentVM = _parentVM;
    }

    public bool IsChecked
    {
        get
        {
            return this._isChecked;
        }
        set
        {
            //This is called when checkbox state is changed
            this._isChecked = value;

            //Add or remove from collection on parent VM, perform sorting here
            if (this.IsChecked)
                _parentVM.FilteredDatabases.Add(this);
            else
                _parentVM.FilteredDatabases.Remove(this);

        }
    }
}

View models should also implement INotifyPropertyChanged, I omitted it since it was not necessary in this particular case.

How do I bind IsChecked property of CheckBox within an ItemsControl?

2 Answers2