locked
Removing an item in the list in MVVM

    Question

  • hello guys i was able to add items using this method

    public ObservableCollection<CartData> cartData
         {
     
             get
             {
                 if (App.Current._cartData == null)
                 {
                     App.Current._cartData = new ObservableCollection<CartData>();
     
                 }
     
    
                 return App.Current._cartData;
     
             }
             set
             {
     
                 SetProperty(ref App.Current._cartData, value);
             }
         }
     
    public CartData(){
     
    cartData.Add(new CartData { Cakename = this.CakeName, Cakeprice = App.Current.cakeprice,ImagePath=bitmapimage,Caketype=App.Current.caketype,Cakesize=App.Current.cakesize });
     
    
    }

    it is binded to the listview, now im trying to remove the item if certain item is selected and pressed a button. How do i know the Index of the selected item in the list? or is there are another way to delete item in the list?

    Tuesday, March 11, 2014 11:23 AM

Answers

  • You can take a look at the source code in the zip-file at the end of this blog post of mine.

    The MainPageViewModel (datacontext of the View) has a Persons and a SelectedPerson property. All you need to do is replace 'Person' by 'CartData' in your code. From your code snippets I can safely assume that the BindableBase class is already in your solution.

    That project also shows how you can delete the selected item through a command binding (search for DeleteCommand in the source, and check the XAML binding in Mainpage.xaml). You'll need an extra class for this, like RelayCommand or DelegateCommand. Some Visual Studio templates come with a version of this class, so you also may also already have it in your solution.

    Tuesday, March 11, 2014 1:03 PM

All replies

  • The MVVM solution to this problem is to create in your ViewModel a property that represents the selected item (e.g. selectedCartData, of the type CartData). Then you can create a two-way binding between this property and the SelectedItem of the ListView.

    Your XAML then looks like this:

    <ListView SelectionMode="Single" ItemsSource="{Binding cartData}" SelectedItem="{Binding selectedCartData, Mode=TwoWay}" />
    The ViewModel now always knows which item is selected and do some stuff with it: update, delete, ...

    Tuesday, March 11, 2014 11:39 AM
  • can you give some simple example on how im going to do that? based on my code im sorry im still newbie this this pattern

    Tuesday, March 11, 2014 12:26 PM
  • You can take a look at the source code in the zip-file at the end of this blog post of mine.

    The MainPageViewModel (datacontext of the View) has a Persons and a SelectedPerson property. All you need to do is replace 'Person' by 'CartData' in your code. From your code snippets I can safely assume that the BindableBase class is already in your solution.

    That project also shows how you can delete the selected item through a command binding (search for DeleteCommand in the source, and check the XAML binding in Mainpage.xaml). You'll need an extra class for this, like RelayCommand or DelegateCommand. Some Visual Studio templates come with a version of this class, so you also may also already have it in your solution.

    Tuesday, March 11, 2014 1:03 PM