Search code examples
wpfmvvmwpfdatagridcollectionviewsource

how to turn off (with a checkbox) WPF/MVVM DataGrid grouping that is implemented using CollectionViewSource?


I have working implementation of datagrid grouping. Below is what i do (GroupStyle with expander omitted):

<CollectionViewSource x:Key="SelectedObjectsViewSource" Source="{Binding SelectedObjectItems}">
    <CollectionViewSource.GroupDescriptions>
       <PropertyGroupDescription PropertyName="TableId"/>
    </CollectionViewSource.GroupDescriptions>
</CollectionViewSource>


<DataGrid Name="SelectedObjectsGrid" 
     ItemsSource="{Binding Source={StaticResource SelectedObjectsViewSource}}"
     SelectionMode="Extended"
     CanUserAddRows="False"
     AutoGenerateColumns="False">

I would like to add a checkbox that user can turn off/on grouping. But i have no idea how to implement this in MVVM


Solution

  • I advise you to bind the checkbox to a bool property of the viewmodel where its setter also sets the grouping status of the collectionview following the assigned value. Like in the following sample: where the bool property bound to the checkbox status is GroupView and the collection bound to the datagrid is View.

    C# ViewModel

    class ViewModel : INotifyPropertyChanged {
        public event PropertyChangedEventHandler PropertyChanged;
        protected void NotifyPropertyChanged(string info)
        {
            if (PropertyChanged != null)
            {
                PropertyChanged(this, new PropertyChangedEventArgs(info));
            }
        }
    
        private ICollectionView _View;
        public ICollectionView View
        {
            get
            {
                return _View;
            }
            set
            {
                _View = View;
                NotifyPropertyChanged("View");
            }
        }
    
        private bool _GroupView;
        public bool GroupView
        {
            get
            {
                return _GroupView;
            }
            set
            {
                if (value != _GroupView)
                {
                    // Clear Grouping status of the view
                    View.GroupDescriptions.Clear();
                    if (value)
                    {
                        // If true set Grouping status
                        View.GroupDescriptions.Add(new PropertyGroupDescription("TableId"));
                    }
                    _GroupView = value;
                    NotifyPropertyChanged("GroupView");
    
                    // Notify the UI that also the View changed in order to redraw the datagrid with or without grouping
                    NotifyPropertyChanged("View");
                }
            }
        }   
    }
    

    C# Code Behind

    public partial class MyWindow : Window
    {
        public MyWindow()
        {
            InitializeComponent();
            ViewModel myViewModel = new ViewModel();
            myViewModel.View = .....;
            DataContext = myViewModel;
    
        }
    }
    

    XAML

    <StackPanel>
        <CheckBox IsChecked="{Binding GroupView, Mode=TwoWay}"/>
        <DataGrid Name="SelectedObjectsGrid" 
                ItemsSource="{Binding View, Mode=TwoWay}"
                SelectionMode="Extended"
                CanUserAddRows="False"
                AutoGenerateColumns="False"/>
    </StackPanel>