combo box does not refresh when observable collection changes

Question

I have a wpf desktop app.

I have a dropdown box and its items source is set to an observable collection.

The purpose is to display a list of users. I have a button on that form that will delete the selected user. It sets the field 'Active' to '0' where '1' is not deleted.

The problem is that even though I can see the observable collection has been reduced by 1. But visually the dropdown shows all the original user states.

This is my XAML:

<ComboBox ItemsSource="{Binding Users}" DisplayMemberPath="Login" 
                 SelectedValue="{Binding SelectedManagerUser}"  />

This is the VM bit of it:

public ObservableCollection<UserRecord> Users
{
    get
    {
        return (from users in UserRecord.Get().Where(d => d.Active == 1)
                     select new UserRecord
                     {
                         FName = users.FName,
                         SName = users.SName,
                         UserRecordId = users.UserRecordId,
                         Login = users.Login,
                         IsAdmin = users.IsAdmin,
                         UserRef = users.UserRef,
                         Disabled = users.Disabled,
                         Branch = users.Branch,
                         Department = users.Department,
                         Position = users.Position,                                
                         Salt = users.Salt,
                     }).OrderBy(d => d.Login).ToList();

    }
    set {
        _Users =  value; RaisePropertyChanged(InformedWorkerCommon.Constants.VM_Users); }
}

My POCO/Model:

public class UserRecord
{
    public int UserRecordId { get; set; }
    public string FName { get; set; }
    public string SName { get; set; }
    public string Login { get; set; }
    public string Salt { get; set; }
    public int IsAdmin { get; set; }
    public string UserRef { get; set; }
    public int Disabled { get; set; }
    public string Branch { get; set; }
    public string Position { get; set; }
    public int Active { get; set; }
    public string Department { get; set; }
    public string ServerRef { get; set; }
    public DateTime ServerTS { get; set; }
}

This is the code that sets the Active field to '0':

my test involves pre-loading with 2 users

private void DeleteUser()
{
    try
    {

at this point the Users count is 2

        UserRecord.Save(new UserRecord()
                {
                    UserRef=UserRef,
                    Branch = Branch,
                    Department = Department,
                    Disabled = Disabled == true ? 1 : 0,
                    FName = FName,
                    IsAdmin = 0,
                    Login = Login,
                    Position = Position,
                    SName = SName,
                    Active = 0,                           
                });

at this point the Users count is 1 but the dropdown still shows 2 users

                DisplayInfoMessage(Properties.Resources.Deleted);
            }
        }
    }
    catch (Exception ex)
    {
        //handle the error
    }
}

I am relatively new to wpf so I could be doing a right howler here?

Answer 1

You should create one single instance of your ObservableCollection and add and remove items from this single instance.

You could create the collection in the constructor of your view model and implement the property as a simple auto-implemented read-only property, e.g.:

public class ViewModel
{
    public ViewModel()
    {
        Users = new ObservableCollection<UserRecord>((from users in UserRecord.Get().Where(d => d.Active == 1)
                                                      select new UserRecord
                                                      {
                                                          FName = users.FName,
                                                          SName = users.SName,
                                                          UserRecordId = users.UserRecordId,
                                                          Login = users.Login,
                                                          IsAdmin = users.IsAdmin,
                                                          UserRef = users.UserRef,
                                                          Disabled = users.Disabled,
                                                          Branch = users.Branch,
                                                          Department = users.Department,
                                                          Position = users.Position,
                                                          Salt = users.Salt,
                                                      }).OrderBy(d => d.Login).ToList());
    }

    public ObservableCollection<UserRecord> Users { get; }

}

Then the ComboBox bound to the Users property will get updated as you add or remove items from the source collection. But you should not create a new ObservableCollection each time the getter of the source property is called.