I want use SelectionChangeEvent of ListBox in MVVM

Question

First of all, I'm good at English. So I'm sorry if I say that you cannot understand.

I have WPF Application with 2 ListBoxs. And I want remake the app as MVVM.

But I don't know coding SelectionChanged Event as MVVM.

I tried this code.

In View code, it contains Comment. It's code that I add then I get advice my friend. (But It's not work, too.)

//View

    xmlns:xcad="http://schemas.xceed.com/wpf/xaml/toolkit"
    mc:Ignorable="d"
    Title="MainWindow" Height="350" Width="525">

//CodeBehinde

private MainViewModel viewmodel;
public MainWindow()
{
    InitializeComponent();
    viewmodel = new MainViewModel();
    this.DataContext = viewmodel;
}

//ViewModel

public class MainViewModel : INotifyPropertyChanged
{
    private ObservableCollection ColorListVal;
    public ObservableCollection ColorList
    {
        get { return ColorListVal; }
        set
        {
            ColorListVal = value;
            NotifyPropertyChanged("ColorList");

        }
    }

    private ObservableCollection SelectColorListVal = new ObservableCollection();
    public ObservableCollection SelectColorList
    {
        get { return SelectColorListVal; }
        set
        {
            SelectColorListVal = value;
            NotifyPropertyChanged("SelectColorList");

            ItemListVal.Clear();

            for (int i = 0; i < SelectColorList.Count; i++)
            {
                switch (SelectColorList[i])
                {
                    case "red":
                        ItemListVal.Add("apple");
                        ItemListVal.Add("sun");
                        break;

                    case "blue":
                        ItemListVal.Add("sea");
                        ItemListVal.Add("sky");
                        break;

                    case "yellow":
                        ItemListVal.Add("lemmon");
                        ItemListVal.Add("pineapple");
                        break;

                    case "green":
                        ItemListVal.Add("vegetable");
                        ItemListVal.Add("greentea");
                        break;
                }
            }
        }
    }

    private ObservableCollection ItemListVal;
    public ObservableCollection ItemList
    {
        get { return ItemListVal; }
        set
        {
            ItemListVal = value;
            NotifyPropertyChanged("ItemList");
        }
    }



    public MainViewModel()
    {
        ColorListVal = new ObservableCollection() { "red", "blue", "yellow", "green" };
        ItemListVal = new ObservableCollection() { "not selected!" };
    }



    public event PropertyChangedEventHandler PropertyChanged;
    private void NotifyPropertyChanged(String info)
    {
        if (PropertyChanged != null)
        {
            PropertyChanged(this, new PropertyChangedEventArgs(info));
        }
    }
}

I want do these...

@If I click "red", the item list shows "apple" and "sun" as ListBox. Then if I click blue...it's same.

@I Want click many color! So if I click red and blue, the item list shos "apple", "sun", "sea" and "sky". (But I don't care the list order)

@The list(both of color and item) contens is not same. So I want set content as dynamic and add items as dynamic.

What should I remake this code?

Sergey Anisimov · Accepted Answer

in your xaml file you bind SelectedItem to SelectColorList, which is a collection, to make it correct you should bind to a single value (some string property in your case), not to collection.
UPDATE:
First of all, I want to mention that there is no way for multiple binding, that's why we will use an event SelectionChanged.
For example, this is your View, which contains two list boxes, one of them will contain a source of colors which will be able for multiple selections:

Your MainWindow.xaml.cs:

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        // Set data context
        DataContext = new ViewModel();
    }

    /// 
    /// Called when selection is changed
    /// 
    /// 
    /// 
    private void ListBox_SelectionChanged(object sender, System.Windows.Controls.SelectionChangedEventArgs e)
    {
        // Get event sender
        var listBox = sender as ListBox;
        // Create temp list for selected items
        var tempList = new List();

        foreach (string item in listBox.SelectedItems)
        {
            tempList.Add(item);
        }

        (DataContext as ViewModel).OnSelectionChanged(tempList);
    }
}

And finally, your view model:

public class ViewModel : INotifyPropertyChanged
{
    #region Private Fields
    private ObservableCollection mColorList;
    private ObservableCollection mItemList;
    #endregion

    #region Public Properties
    /// 
    /// This is list box 1 items source with colors
    /// 
    public ObservableCollection ColorList
    {
        get { return mColorList; }
        set
        {
            mColorList = value;
            NotifyPropertyChanged(nameof(ColorList));
        }
    }

    /// 
    /// This is list box 2 items with results
    /// 
    public ObservableCollection ItemList
    {
        get { return mItemList; }
        set
        {
            mItemList = value;
            NotifyPropertyChanged(nameof(ItemList));
        }
    }
    #endregion

    #region Constructor
    public ViewModel()
    {
        // Initialization 
        ColorList = new ObservableCollection() { "red", "blue", "yellow", "green" };
        ItemList = new ObservableCollection() { "not selected!" };
    }
    #endregion

    #region Public Methods
    /// 
    /// Called when selection is changed
    /// 
    /// 
    public void OnSelectionChanged(IEnumerable selectedItems)
    {
        ItemList.Clear();
        foreach (var item in selectedItems)
        {
            switch (item)
            {
                case "red":
                    ItemList.Add("apple");
                    ItemList.Add("sun");
                    break;
                case "blue":
                    ItemList.Add("sea");
                    ItemList.Add("sky");
                    break;
            }
        }
    }
    #endregion

    #region InterfaceImplementation
    public event PropertyChangedEventHandler PropertyChanged;

    public void NotifyPropertyChanged(string propertyName)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
    #endregion
}

This is how it can be done. Hope this answer will help you

I want use SelectionChangeEvent of ListBox in MVVM

Answers (2)

Related Questions