We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How to display the group header based on the column name in WPF DataGrid (SfDataGrid)?

Platform: WPF |
Control: SfDataGrid |
Published Date: July 10, 2017 |
Last Revised Date: March 25, 2021 |
.NET Framework: 4.5
Tags: grouping

The group header name is displayed only based on the grouped column header name. In order to display group Header name based on the other column, you need to customize the GridCaptionSummaryCellRenderer and override the OnInitializeEditElement and OnUpdateEditBinding methods in WPF DataGrid (SfDataGrid).

Refer the below code example in which CustomCaptionSummaryCellRenderer class extended from GridCaptionSummaryCellRenderer and the column text based on other columns is obtained by passing the other column’s mapping name to the GetCustomizedCaptionText parameters to achieve the desired outcome.

C#

public class CustomCaptionSummaryCellRenderer : GridCaptionSummaryCellRenderer
{
    /// <summary>
    /// Method to Update the CaptionSummaryCell.
    /// </summary>
    public override void OnUpdateEditBinding(DataColumnBase dataColumn, GridCaptionSummaryCell element, object dataContext)
    {
        if (element.DataContext is Group && this.DataGrid.View.GroupDescriptions.Count > 0)
        {
            string groupName = string.Empty;
            string groupText = string.Empty;
            var groupRecord = element.DataContext as Group;
            //get the column which is grouped.
            var groupedColumn = this.GetGroupedColumn(groupRecord);
            var groupRecords = (groupRecord.Details as GroupRecordEntry).Records;
            var groupData = (groupRecords[0] as RecordEntry).Data;
            if (groupedColumn.MappingName == "EmployeeID")
            {
                groupName = (groupData as BusinessObjects).EmployeeName;
                groupText = "Employee Name";
            }
            else
            {
                groupName = groupRecord.Key.ToString();
                groupText = groupedColumn.HeaderText;
            }
            if (this.DataGrid.CaptionSummaryRow == null)
            {
                if (this.DataGrid.View.GroupDescriptions.Count < groupRecord.Level)
                    return;
                //set the captionsummary text as customized.
                element.Content = GetCustomizedCaptionText(groupText, groupName, groupRecord.ItemsCount);
            }
            else if (this.DataGrid.CaptionSummaryRow.ShowSummaryInRow)
            {
                element.Content = SummaryCreator.GetSummaryDisplayTextForRow(groupRecord.SummaryDetails, this.DataGrid.View, groupedColumn.HeaderText);
            }
            else
                element.Content = SummaryCreator.GetSummaryDisplayText(groupRecord.SummaryDetails, dataColumn.GridColumn.MappingName, this.DataGrid.View);
        }
    }
}

Grouped the EmployeeID column based on the EmployeeName is displayed in the view.

Display the group header in WPF DataGrid

View sample in GitHub.

2X faster development

The ultimate WPF UI toolkit to boost your development speed.
ADD COMMENT
You must log in to leave a comment

Please sign in to access our KB

This page will automatically be redirected to the sign-in page in 10 seconds.

Up arrow icon

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile