Wpf mvvm ObservableCollection doesn't update listView

Question

Wpf mvvm ObservableCollection doesn't update listView

Anja 426

I want to update a listview in View when adding/removing an entry.

When running to curser I can see, that my Categories_GetActive is updated with row 4(and so on) but it doesn't show up in my ListView.

When starting the page, the 3 rows from db is in the listview.

Can anyone please help me to see, what I'm doing wrong?

Best regards
Simsen :-)

What I have done

My Listview here I want to bind to Categories_GetActive

    <ListView x:Name="LivCategories" ItemsSource="{Binding Categories_GetActive}" 
                                  SelectedItem="{Binding SelectedCategory}" Grid.Row="0" Grid.Column="0">
                            <ListView.View>
                                <GridView>
                                    <GridViewColumn Header="Id" Width="50" DisplayMemberBinding="{Binding CategoryId}"/>
                                    <GridViewColumn Header="Navn" Width="250"  DisplayMemberBinding="{Binding CategoryName}"/>
                                    <GridViewColumn Header="Global" Width="50"  DisplayMemberBinding="{Binding CategoryIsGlobal}"/>
                                    <GridViewColumn Header="Project" Width="150"  DisplayMemberBinding="{Binding ProjectName}"/>
                                    <GridViewColumn Header="ProjectId" Width="0"  DisplayMemberBinding="{Binding ProjectId}" />
                                </GridView>
                            </ListView.View>
                        </ListView>

In my ViewModel

public CategoryViewModel()
            {
                LoadCategories();
                LoadProjects();
                CmdSave = new MyICommand(SaveChanges);
                CmdSaveNew = new MyICommand(SaveNew);
                //CmdUpdateLists = new MyICommand(UpdateLists);
            }

and

public ObservableCollection<Category> Categories_GetAll { get; set; }
            public ObservableCollection<Category> Categories_GetActive { get; set; }
            public ObservableCollection<Category> Categories_GetInactive { get; set; }
            public void LoadCategories()
            {
                DalCategory dalCategory = new DalCategory();
                var categories = dalCategory.GetCategories();

                if (categories != null)
                {
                    //All
                    List<Category> Categories_GetAllList = categories;
                    Categories_GetAll = new ObservableCollection<Category>(Categories_GetAllList);

                    //Active
                    List<Category> Categories_GetActiveList = categories.Where(x => x.CategoryIsObsolete == false).ToList();
                    Categories_GetActive = new ObservableCollection<Category>(Categories_GetActiveList);

                    //Inactive
                    List<Category> Categories_GetInactiveList = categories.Where(x => x.CategoryIsObsolete == true).ToList();
                    Categories_GetInactive = new ObservableCollection<Category>(Categories_GetInactiveList);
                }
            }

And here I add a row to the Categories_GetActive

public MyICommand CmdSaveNew { get; set; }

        public void SaveNew()
        {
            ResetMessages();

            DalCategory dal = new DalCategory();

            if (!string.IsNullOrEmpty(CategoryName))
            {
                string name = CategoryName;
                bool global = CategoryIsGlobal;
                bool obsolete = CategoryIsObsolete;
                int projectId = ProjectId;

                Category cat = new Category();
                cat.CategoryName = CategoryName;
                cat.CategoryIsGlobal = CategoryIsGlobal;
                cat.CategoryIsObsolete = CategoryIsObsolete;
                cat.ProjectId = ProjectId;

                int categoryId = dal.NewCategory(cat);

                if (cat.CategoryIsObsolete == false)
                {
                    Categories_GetActive.Add(cat);
                }
                else
                {
                    Categories_GetInactive.Add(cat);
                }

                MessageOk = "Kategorien er gemt";
            }
            else
            {
                MessageError = "Kategorinavn skal udfyldes";
            }
        }

Accepted answer

3 additional answers

Your answer

Answer 1

Hi Anja,
instead of using different instances use singleton pattern:

namespace ViewModel.Account
{
  public class CategoryViewModel : INotifyPropertyChanged
  {

    private static CategoryModel _instance = null;

    public static CategoryModel GetInstance()
    {
      if (_instance == null) _instance = new CategoryModel();
      return _instance;
    }

...

namespace Views.Account
{
  /// <summary>
  /// Interaction logic for AccountObsoleteView.xaml
  /// </summary>
  public partial class AccountObsoleteView : UserControl
  {
    public AccountObsoleteView()
    {
      InitializeComponent();
      //DataContext = new ViewModel.Account.CategoryViewModel(); replace with following assignment
      DataContext = ViewModel.Account.CategoryViewModel.GetInstance();
    }

...

namespace Views.Account
{
  /// <summary>
  /// Interaction logic for AccountObsoleteViewCategoryNew.xaml
  /// </summary>
  public partial class AccountObsoleteViewCategoryNew : UserControl
  {
    public AccountObsoleteViewCategoryNew()
    {
      InitializeComponent();
      //DataContext = new ViewModel.Account.CategoryViewModel(); replace with following assignment
      DataContext = ViewModel.Account.CategoryViewModel.GetInstance();
    }

...

Anja 426 Reputation points

2021-04-26T13:05:44.957+00:00

I can't find my thank you to you.

But thank you so very much. I'm so grateful. You have helped me so much.

Best regards
Simsen :-)

Answer 2

Anja 426

I have made a few changes to see if that help but no.

I have added it to an OnPropertyChanged (for all 3)

private ObservableCollection<Category> _categories_GetAll;
        public ObservableCollection<Category> Categories_GetAll 
        { 
            get
            {
                return _categories_GetAll;
            }
            set
            {
                _categories_GetAll = value;
                OnPropertyChanged("Categories_GetAll");
            }
        }

And then tried this in the View of the ListView

<ListView x:Name="LivCategories" ItemsSource="{Binding Categories_GetActive, UpdateSourceTrigger=PropertyChanged}" 
                                      SelectedItem="{Binding SelectedCategory}" Grid.Row="0" Grid.Column="0">
                                <ListView.View>
                                    <GridView>
                                        <GridViewColumn Header="Id" Width="50" DisplayMemberBinding="{Binding CategoryId}"/>
                                        <GridViewColumn Header="Navn" Width="250"  DisplayMemberBinding="{Binding CategoryName}"/>
                                        <GridViewColumn Header="Global" Width="50"  DisplayMemberBinding="{Binding CategoryIsGlobal}"/>
                                        <GridViewColumn Header="Project" Width="150"  DisplayMemberBinding="{Binding ProjectName}"/>
                                        <GridViewColumn Header="ProjectId" Width="0"  DisplayMemberBinding="{Binding ProjectId}" />
                                    </GridView>
                                </ListView.View>
                            </ListView>

DaisyTian-1203 11,646 Reputation points

2021-04-20T01:45:03.443+00:00

@Anja
I can't make a sample based on your provided code to reproduce the error, could you provide the related code for LoadProjects();,MyICommand, SaveChanges and DalCategory or share a sample on github or onedrive? Please provide more code for me to make a demo to analyze.

Anja 426

Further down I have made a link to my solution.

Load Projects:

 public List<Project> Projects_GetActive { get; set; }
        public void LoadProjects()
        {
            DalProjects dalProjects = new DalProjects();
            var projects = dalProjects.GetProjects();

            if (projects != null)
            {
                //Active
                Projects_GetActive = projects.Where(x => x.ProjectIsActive == true).ToList();
            }
        }

Anja 426

namespace ViewModel
{
    public class MyICommand : ICommand
    {
        readonly Action _TargetExecuteMethod;
        readonly Func<bool> _TargetCanExecuteMethod;

        public MyICommand(Action executeMethod)
        {
            _TargetExecuteMethod = executeMethod;
        }

        public MyICommand(Action executeMethod, Func<bool> canExecuteMethod)
        {
            _TargetExecuteMethod = executeMethod;
            _TargetCanExecuteMethod = canExecuteMethod;
        }

Anja 426

public void RaiseCanExecuteChanged()
        {
            CanExecuteChanged(this, EventArgs.Empty);
        }

        bool ICommand.CanExecute(object parameter)
        {

            if (_TargetCanExecuteMethod != null)
            {
                return _TargetCanExecuteMethod();
            }

            if (_TargetExecuteMethod != null)
            {
                return true;
            }

            return false;
        }

        // Beware - should use weak references if command instance lifetime 
        // is longer than lifetime of UI objects that get hooked up to command

        // Prism commands solve this in their implementation 
        public event EventHandler CanExecuteChanged = delegate { };

        void ICommand.Execute(object parameter)
        {
            _TargetExecuteMethod?.Invoke();
        }
    }
}

Anja 426

public MyICommand CmdSave { get; set; }
        public void SaveChanges()
        {
            ResetMessages();
            if (SelectedCategory != null)
            {

            }
        }

Anja 426

public class DalCategory

{
    #region Get
    public List<Category> GetCategories()
    {
        string cnn = ConfigurationManager.ConnectionStrings["AnsiBugDb"].ToString();
        if (cnn != string.Empty)
        {
            using (IDbConnection connection = new SqlConnection(cnn))
            {
                if (connection.State == ConnectionState.Closed)
                {
                    connection.Open();
                }

                List<Category> testList = connection.Query<Category>("dbo.Category_GetAll").ToList();

                return testList;
            }
        }
        else
        {
            return new List<Category>();
        }
        //TODO Try/Catch

    }
    #endregion

Anja 426

#region Insert
        public int NewCategory(Category objCat)
        {
            string cnn = ConfigurationManager.ConnectionStrings["AnsiBugDb"].ToString();
            if (cnn != string.Empty)
            {
                using (IDbConnection connection = new SqlConnection(cnn))
                {
                    if (connection.State == ConnectionState.Closed)
                    {
                        connection.Open();
                    }

Anja 426

var param = new DynamicParameters();
                    param.Add("@CategoryName", dbType: DbType.String, value: objCat.CategoryName);
                    param.Add("@CategoryIsGlobal", dbType: DbType.Boolean, value: objCat.CategoryIsGlobal);
                    param.Add("@CategoryIsObsolete", dbType: DbType.Boolean, value: objCat.CategoryIsObsolete);
                    param.Add("@ProjectId", dbType: DbType.Int32, value: objCat.ProjectId);
                    param.Add("@Id", dbType: DbType.String, direction:ParameterDirection.Output, size:5215585);

Anja 426

                    connection.Execute("Category_New", param, commandType: CommandType.StoredProcedure);

                    var Id = param.Get<string>("@Id");

                    return Convert.ToInt32(Id);
                }
            }
            else
            {
                return 0;
            }
            //TODO Try/Catch            
        }
        #endregion

Anja 426

#region Update
        public void SetCategory(Category objCat)
        {
            string cnn = ConfigurationManager.ConnectionStrings["AnsiBugDb"].ToString();
            if (cnn != string.Empty)
            {
                using (IDbConnection connection = new SqlConnection(cnn))
                {
                    if (connection.State == ConnectionState.Closed)
                    {
                        connection.Open();
                    }

                    connection.Execute("Category_Set", objCat, commandType: CommandType.StoredProcedure);
                }
            }
            //TODO Try/Catch            
        }
        #endregion

Answer 3

Hi Anja,
I change your code a little bit and it works fine. Please, try my demo.

XAML:

<Window x:Class="WpfApp1.Window035"  
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"  
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"  
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"  
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"  
        xmlns:local="clr-namespace:WpfApp035"  
        mc:Ignorable="d"  
        Title="MainWindow" Height="450" Width="800">  
  <Window.DataContext>  
    <local:CategoryViewModel/>  
  </Window.DataContext>  
  <Grid>  
    <Grid.RowDefinitions>  
      <RowDefinition/>  
      <RowDefinition Height="auto"/>  
      <RowDefinition Height="auto"/>  
      <RowDefinition Height="auto"/>  
      <RowDefinition Height="auto"/>  
      <RowDefinition Height="auto"/>  
    </Grid.RowDefinitions>  
    <ListView x:Name="LivCategories"   
              ItemsSource="{Binding Categories_GetActive}"   
              SelectedItem="{Binding SelectedCategory}" Grid.Row="0" Grid.Column="0">  
      <ListView.View>  
        <GridView>  
          <GridViewColumn Header="Id" Width="50" DisplayMemberBinding="{Binding CategoryId}"/>  
          <GridViewColumn Header="Navn" Width="250"  DisplayMemberBinding="{Binding CategoryName}"/>  
          <GridViewColumn Header="Global" Width="50"  DisplayMemberBinding="{Binding CategoryIsGlobal}"/>  
          <GridViewColumn Header="Project" Width="150"  DisplayMemberBinding="{Binding ProjectName}"/>  
          <GridViewColumn Header="ProjectId" Width="0"  DisplayMemberBinding="{Binding ProjectId}" />  
        </GridView>  
      </ListView.View>  
    </ListView>  
      
    <!-- Button to add Catergories-->  
    <Button Grid.Row="1" Content="Add Category" Command="{Binding CmdSaveNew}" Width="150" Margin="5"/>  
  
    <!--And here I show you a Checkbox witch works perfectly-->  
    <CheckBox Content="Inaktiv:" Grid.Row="2"  
              IsChecked="{Binding ElementName=LivCategories, Path=SelectedValue.CategoryIsObsolete, Mode=TwoWay}" />  
  
    <!--One of the ways I have tried for the ComboBox you can see here-->  
    <ComboBox Grid.Row="3"  
              ItemsSource="{Binding Path=Projects_GetActive}" DisplayMemberPath="ProjectName"  
              Text="{Binding ElementName=LivCategories, Path= SelectedValue.ProjectName}"/>  
      
  </Grid>  
</Window>

And classes:

using System;  
using System.Collections.ObjectModel;  
using System.ComponentModel;  
using System.Windows;  
using System.Windows.Data;  
using System.Windows.Input;  
  
namespace WpfApp035  
{  
  public class CategoryViewModel  
  {  
    public CategoryViewModel()  
    {  
      LoadCategories();  
      LoadProjects();  
      //CmdSave = new MyICommand(SaveChanges);  
      CmdSaveNew = new MyICommand(SaveNew);  
      //CmdUpdateLists = new MyICommand(UpdateLists);  
    }  
  
    private void LoadCategories()  
    {  
      //DalCategory dalCategory = new DalCategory();  
      //var categories = dalCategory.GetCategories();  
  
      //if (categories != null)  
      //{  
      //  //All  
      //  List<Category> Categories_GetAllList = categories;  
      //  Categories_GetAll = new ObservableCollection<Category>(Categories_GetAllList);  
  
      //  //Active  
      //  List<Category> Categories_GetActiveList = categories.Where(x => x.CategoryIsObsolete == false).ToList();  
      //  Categories_GetActive = new ObservableCollection<Category>(Categories_GetActiveList);  
  
      //  //Inactive  
      //List<Category> Categories_GetInactiveList = categories.Where(x => x.CategoryIsObsolete == true).ToList();  
  
      // for demo only  
      colCA.Add(new Category() { CategoryId = 1, CategoryIsGlobal = true, CategoryIsObsolete = false, CategoryName = "Cat 1", ProjectId = 11, ProjectName = "Project 11" });  
      colCA.Add(new Category() { CategoryId = 2, CategoryIsGlobal = false, CategoryIsObsolete = false, CategoryName = "Cat 2", ProjectId = 12, ProjectName = "Project 12" });  
      colCA.Add(new Category() { CategoryId = 3, CategoryIsGlobal = true, CategoryIsObsolete = false, CategoryName = "Cat 3", ProjectId = 13, ProjectName = "Project 13" });  
      colCA.Add(new Category() { CategoryId = 4, CategoryIsGlobal = false, CategoryIsObsolete = true, CategoryName = "Cat 4", ProjectId = 14, ProjectName = "Project 14" });  
      colCA.Add(new Category() { CategoryId = 5, CategoryIsGlobal = true, CategoryIsObsolete = false, CategoryName = "Cat 5", ProjectId = 15, ProjectName = "Project 15" });  
      cvsCA.Source = colCA;  
    }  
  
    private void LoadProjects()  
    {  
      ObservableCollection<Project> colPA = new ObservableCollection<Project>();  
      colPA.Add(new Project() { ProjectName = "Project 11" });  
      colPA.Add(new Project() { ProjectName = "Project 12" });  
      colPA.Add(new Project() { ProjectName = "Project 13" });  
      colPA.Add(new Project() { ProjectName = "Project 14" });  
      colPA.Add(new Project() { ProjectName = "Project 15" });  
      cvsPA.Source = colPA;  
    }  
  
    ObservableCollection<Category> colCA = new ObservableCollection<Category>();  
     public ICollectionView Categories_GetActive { get => cvsCA.View; }  
   //public ObservableCollection<Category> Categories_GetActive { get; set; }  
    public ObservableCollection<Category> Categories_GetAll { get; set; }  
    public ObservableCollection<Category> Categories_GetInactive { get; set; }  
  
    private CollectionViewSource cvsCA = new CollectionViewSource();  
  
    public Category SelectedCategory { get; set; }  
  
    private CollectionViewSource cvsPA = new CollectionViewSource();  
    public ICollectionView Projects_GetActive { get => cvsPA.View; }  
  
  
    public ICommand CmdSaveNew { get; set; }  
  
    public void SaveNew(object parameter)  
    {  
      //ResetMessages();  
  
      //DalCategory dal = new DalCategory();  
  
      if (!string.IsNullOrEmpty("x")) // CategoryName))  
      {  
        //string name = CategoryName;  
        //bool global = CategoryIsGlobal;  
        //bool obsolete = CategoryIsObsolete;  
        //int projectId = ProjectId;  
  
        Category cat = new Category();   
        cat.CategoryName = "Cat new"; // CategoryName;  
        cat.CategoryIsGlobal = true; // CategoryIsGlobal;  
        cat.CategoryIsObsolete = false; // CategoryIsObsolete;  
        cat.ProjectId = 11; // ProjectId;  
  
        //int categoryId = dal.NewCategory(cat);  
  
  
        if (cat.CategoryIsObsolete == false)  
        {  
          //Categories_GetActive.Add(cat);  
          colCA.Add(cat);  
        }  
        else  
        {  
          Categories_GetInactive.Add(cat);  
        }  
  
        //MessageOk = "Kategorien er gemt";  
        MessageBox.Show( "Kategorien er gemt");  
      }  
      else  
      {  
        //MessageError = "Kategorinavn skal udfyldes";  
        MessageBox.Show("Kategorinavn skal udfyldes");  
      }  
    }  
  }  
  
  public class Category  
  {  
    public int CategoryId { get; set; }  
    public string CategoryName { get; set; }  
    public bool CategoryIsGlobal { get; set; }  
    public string ProjectName { get; set; }  
    public int ProjectId { get; set; }  
    public bool CategoryIsObsolete { get; set; }  
  }  
  
  public class Project  
  {  
    public string ProjectName { get; set; }  
  }  
  
  public class MyICommand : ICommand  
  {  
    private readonly Predicate<object> _canExecute;  
    private readonly Action<object> _action;  
    public MyICommand(Action<object> action) { _action = action; _canExecute = null; }  
    public MyICommand(Action<object> action, Predicate<object> canExecute) { _action = action; _canExecute = canExecute; }  
    public void Execute(object o) => _action(o);  
    public bool CanExecute(object o) => _canExecute == null ? true : _canExecute(o);  
    public event EventHandler CanExecuteChanged  
    {  
      add { CommandManager.RequerySuggested += value; }  
      remove { CommandManager.RequerySuggested -= value; }  
    }  
  }  
}

Result:

Anja 426 Reputation points

2021-04-20T17:45:33.607+00:00

Hi,
Thank you for the code. It works perfect when making the button on the same page as the ListView,

But doesn't update anything when make new category in a popup window.

I'm cable of making the new window, saving the new Category and closing the window, but I can't update the ListView when returning to the ListView even I can see in the viewmodel, that there is a 4.(and so on) new row.

Best regards,
SImsen :-)
Anja 426 Reputation points

2021-04-20T17:46:20.333+00:00

That is what it looks like

Answer 4

Anja 426

I have uploaded the solution and a backup of the database.

I need to guide you into the problem:

Run the solution.

Click on Administration menu button in the top
Click on "Ret konto" (Edit account)
Now you are on the window with the ListView
Now click on "Ny" (New) button

Write something in the textbox.
Click on "Gem" (Save)
It will now go into the CategoryViewModel SaveNew() method.
And I can see the Category is in the Categories_GetActive but not listed in the ListView.

I don't have the problem when saving the exact same Method in a button on the window where the Listview are.

I have saved it to github: AnsiBug

Peter Fleischer (former MVP) 19,341 Reputation points

2021-04-21T11:33:06.317+00:00

Hi Anja,
in your solution you use different instances of ViewModel.Account.CategoryViewModel in AccountObsoleteView and in AccountObsoleteViewCategoryNew. Change values in one instance don't change values in other instance.
Anja 426 Reputation points

2021-04-21T15:48:20.99+00:00
Yes I do - I do not know how to use the mainwindows instance of the CategoryViewModel?

So what do I have to write instead of this:

DataContext = new ViewModel.Account.CategoryViewModel();
Anja 426 Reputation points

2021-04-21T16:35:47.4+00:00
I have tried a little bit but get errors.

I have set this in the app.xaml

<local:MainWindow x:Key="ViewModel.Account.CategoryViewModel" />

This to reuse that specific instance.

My CategoryViewModel is set in the project ViewModel.Account and then CategoryViewModel

My mainwindow is in project AnsiBug.MainWindow.

Where I have to use that specific instance is in the project (usercontrols)

Views.Account/AccountObsoleteView.xaml
and
View.Account/AccountObsoletteViewCategoryNew.xaml

The error says that the path for the Ressource could not be found ViewModel.Account.CategoryViewModel

What do I have to write in the App.Xaml so that it can find the project + path to the xaml file?

In my usercontrols I have made this to get to the CategoryViewModel

DataContext="{StaticResource ViewModel.Account.CategoryViewModel}"
Peter Fleischer (former MVP) 19,341 Reputation points

2021-04-21T19:11:14.55+00:00

Hi Anja,
you can assign DataContext in MainWindow and use this DataContext in embedded UserControls without new assign of DataContext.
Anja 426 Reputation points

2021-04-22T13:43:18.053+00:00

I'm a little bit confused.

If I assigning the CategoryViewModel to the DataContext in main window - then I can't use another one when it is the Platform, Priority and so on?

I am using the mainview for everything (almost) so I don't set the DataContext in the MainView. But I use 2 usercontrols for 1 vm.

So in my mainview I add a lot of usercontrols.

I have just checked and I can't set more than 1 vm to the DataContext. I then have tried to set the DataContext for the first uc and then nothing in the popup window but then there is nothing recognize - no errors, but no saving to the db or update of the first uc.

I can't in the mainview check which UserControl I'm using.

The way is this:
MainView - choose a usercontrol eg Account.
Then in the Account usercontrol I choose if it is the Category usercontrol or the Platform usercontrol and so on.
Peter Fleischer (former MVP) 19,341 Reputation points

2021-04-22T13:59:23.823+00:00

Hi,
use singleton pattern!
Anja 426 Reputation points

2021-04-22T16:55:03.83+00:00

Thank you so much - I will google this :-)
Peter Fleischer (former MVP) 19,341 Reputation points

2021-04-22T17:30:04.69+00:00

Hi Anja,
I show singleton code for you in my other answer (see below).
Anja 426 Reputation points

2021-04-23T14:02:58.097+00:00

Thank you so very very much.

I'm grateful for all your kind help.

So again thank you very much.

Best regards
Simsen :-)

Share via

Wpf mvvm ObservableCollection doesn't update listView

3 additional answers

Your answer