legrandviking
legrandviking

Reputation: 2414

Updating the checkbox state automatically does not reflect in the GUI

I have a setting window containing an observable collection of roles and components. The idea here is that when you select a role on the left, it automatically checks the components associated to that role on the right. The main problem is that the action is performed correctly behind the scenes but is not reflected on the UI.

My xaml is set up with a data template to display the check boxes in a list:

 <ListBox Name="Components" ItemsSource="{Binding Components, Mode=TwoWay}" ScrollViewer.CanContentScroll="False">
        <ListBox.ItemTemplate>
           <DataTemplate>
              <CheckBox Content="{Binding Name}" Foreground="{DynamicResource MainForegroundColor}" IsChecked="{Binding IsChecked, Mode=TwoWay}" Margin="5 5 0 0" />
           </DataTemplate>
         </ListBox.ItemTemplate>

My viewmodel code is quite simple, I create a selectableComponent class to hold the check box state and its information, and a role class:

public class SelectableComponent
{
    public string Name { get; set; }
    public int Id { get; set; }
    public bool IsChecked { get; set; }
} 


public class Role
{
  public string Name { get; set; }
  public string projectsToWatch { get; set; }
}

public ObservableCollection<SelectableComponent> Components { get; set; }

The method that gets called when you change the role:

public void LoadSpecificRoleComponents(string role)
{

  Role r = Config.Instance.Roles.FirstOrDefault(a => string.Equals(a.Name, role, System.StringComparison.InvariantCultureIgnoreCase));

  foreach (SelectableComponent sc in Components)
  {
       if (string.Equals(r.projectsToWatch, "*"))
       {
           sc.IsChecked = true;
       }
       else
       {
           sc.IsChecked = r.projectsToWatch.Contains(sc.Name, System.StringComparison.InvariantCultureIgnoreCase);
       }
  }

    RaisePropertyChanged("Components");
}

What I don't understand is why the UI does not get updated properly. Since I do RaisePropertyChanged("Components") on the components, it should update.

Any type of help would be appreciated, it's probably a simple thing I am missing out on.

Upvotes: 0

Views: 327

Answers (2)

Radin Gospodinov
Radin Gospodinov

Reputation: 2323

SelectableComponent needs to implement INotifyPropetyChanged and to raise RaisePropertyChanged event for IsChecked:

private bool _isChecked 

public bool IsChecked { 
get{ return _isChecked;} 
set
 {
      if(_isChecked != value)
      {   _isChecked= value;
          RaisePropertyChanged("IsChecked");
      }
 }
}

Upvotes: 1

Sasha
Sasha

Reputation: 853

You should implement INotifyPropertyChanged for your SelectableComponent. Then do so:

private string _name = string.Empty; 
public string Name
{
    get{ return _name;}
    set 
    {
        _name = value;
        RaisePropertyChanged("Name");
    }
}

And do the same for your ObservableCollection:

private ObservableCollection<Component> _componentCollection = new ObservableCollection<Component>();
public ObservableCollection<Component> Components
{
    get{ return _componentCollection; }
    set
    {
        _componentCollection = value;
        RaisePropertyChanged("Components");
    }
}

Upvotes: 0

Related Questions