Grouping data on Datagrid wpf

Question

I want to regroup my data with an expander that contains the group name and contains all ClassMate name inside.

This is my class Group :

public class Group{ 
public List<ClassMate> CLGroup { get; set; }
public string GroupName { get; set; }}

My classMate class :

public class ClassMate: INotifyPropertyChanged{
public string Name { get; set; }
public string DisplayName { get; set; }}

I tried to do this with this Xaml but I don't know why it's not working

<DataGrid x:Name="gridMates"  ItemsSource="{Binding Groups }"  >
    <DataGrid.GroupStyle>
        <!-- Style for groups at top level. -->
        <GroupStyle>
            <GroupStyle.ContainerStyle>
                <Style TargetType="{x:Type GroupItem}">
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="{x:Type GroupItem}">
                                <Expander IsExpanded="True" >
                                    <Expander.Header>
                                        <DockPanel>

                                        <TextBlock Text="{Binding Path=GroupName}" />
                                    </DockPanel>
                                    </Expander.Header>
                                    <Expander.Content>
                                        <ItemsControl ItemsSource="{Binding Path=CLGroup}">
                                            <ItemsControl.ItemTemplate>
                                                <DataTemplate>
                                                    <StackPanel>
                                                        <TextBlock   Text="{Binding Path=DisplayName}"/>

                                                    </StackPanel>

                                                </DataTemplate>
                                            </ItemsControl.ItemTemplate>
                                        </ItemsControl>
                                    </Expander.Content>
                                </Expander>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </GroupStyle.ContainerStyle>
        </GroupStyle>

    </DataGrid.GroupStyle>

What am I doing wrong? Thanks

Answer 1

You need to bind the ItemsSource property to a grouped source collection. The easiest way to do this is to use a CollectionViewSource:

<Grid>
    <Grid.Resources>
        <CollectionViewSource x:Key="groups" Source="{Binding Groups}">
            <CollectionViewSource.GroupDescriptions>
                <PropertyGroupDescription PropertyName="GroupName" />
            </CollectionViewSource.GroupDescriptions>
        </CollectionViewSource>
    </Grid.Resources>
    <DataGrid x:Name="gridMates" ItemsSource="{Binding Source={StaticResource groups}}" AutoGenerateColumns="False">
        <DataGrid.GroupStyle>
            <GroupStyle>
                <GroupStyle.ContainerStyle>
                    <Style TargetType="{x:Type GroupItem}">
                        <Setter Property="Template">
                            <Setter.Value>
                                <ControlTemplate TargetType="{x:Type GroupItem}">
                                    <Expander IsExpanded="True" >
                                        <Expander.Header>
                                            <DockPanel>
                                                <TextBlock Text="{Binding Path=Name}" />
                                            </DockPanel>
                                        </Expander.Header>
                                        <Expander.Content>
                                            <ItemsControl ItemsSource="{Binding Path=Items[0].CLGroup}">
                                                <ItemsControl.ItemTemplate>
                                                    <DataTemplate>
                                                        <StackPanel>
                                                            <TextBlock Text="{Binding Path=DisplayName}"/>
                                                        </StackPanel>
                                                    </DataTemplate>
                                                </ItemsControl.ItemTemplate>
                                            </ItemsControl>
                                        </Expander.Content>
                                    </Expander>
                                </ControlTemplate>
                            </Setter.Value>
                        </Setter>
                    </Style>
                </GroupStyle.ContainerStyle>
            </GroupStyle>
        </DataGrid.GroupStyle>
    </DataGrid>
</Grid>