Articles in this section
Category / Section

How to Change the GroupCaptionText based on Display member of the GridComboboxColumn?

1 min read

In the SfDataGrid, while grouping the GridComboBoxColumn, the Group key is displayed in the GroupCaptionText based on the SelectedValuePath instead of the DisplayMemberPath of the GridComboBoxColumn. In the following code example, the GridComboBoxColumn is defined with the DisplayMemberPath and SelectedValuePath.

XAML

<syncfusion:SfDataGrid.Columns>
       <syncfusion:GridComboBoxColumn  
                                    MappingName="Country"
                                    ItemsSource="{Binding Companies,
                                                Source={StaticResource employeeinfocollection}}" 
                                    DisplayMemberPath=" CountryName "
                                    SelectedValuePath="CountryCode"
                                    HeaderText="Country" >
       </syncfusion:GridComboBoxColumn>
</syncfusion:SfDataGrid.Columns>

 

The following is the ViewModel class with ItemsSource for the GridComboBoxColumn

C#

public class EmployeeInfoCollection
{       
        private ObservableCollection<CompanyItem> companies;
        public ObservableCollection<CompanyItem> Companies
        {
            get{ return companies; }
            set{ companies = value; }
        }
        public EmployeeInfoCollection()
        {
            companies = new ObservableCollection<CompanyItem>()
            {
            new CompanyItem() { CountryCode = "NR", CountryName = "NAURU" },
            new CompanyItem() { CountryCode = "NP", CountryName = "NEPAL" },
            new CompanyItem() { CountryCode = "NL", CountryName = "NETHERLANDS" },
            new CompanyItem() { CountryCode = "NZ", CountryName = "NEW ZEALAND" },
            new CompanyItem() { CountryCode = "NI", CountryName = "NICARAGUA" },
            new CompanyItem() { CountryCode = "NE", CountryName = "NIGER" },
            new CompanyItem() { CountryCode = "NG", CountryName = "NIGERIA" },
            new CompanyItem() { CountryCode = "NU", CountryName = "NIUE" }  
      };
    }
}

 

In the following screenshot of the SfDataGrid, the Group key displays the actual value instead of the Display value of the column.

 

 

It is possible to display the Group key based on the DisplayMemberPath in the GroupCaptionText by setting the GroupColumnDescription.Converter property that converts the actual value based on the DisplayMemberPath. GridComboBoxColumn is passed as the Converter parameter and the underlying record bound with the row is passed as the value for the converter. Refer to the following code example for customizing the GroupColumnDescription with the Converter defined.

XAML

<Window.Resources>
        <local:EmployeeInfoCollection x:Key="employeeinfocollection"/>
</Window.Resources> 
<syncfusion:SfDataGrid x:Name="datagrid"
                        DataContext="{Binding Source={StaticResource employeeinfocollection}}"
                        AutoGenerateColumns="False"
                        ShowGroupDropArea="True"
                        ItemsSource="{Binding Path=EmpCollection}" >
    <syncfusion:SfDataGrid.Columns>
        <syncfusion:GridTextColumn MappingName="Gender" />
        <syncfusion:GridComboBoxColumn  
                            MappingName="CountryCode"
                            ItemsSource="{Binding Companies,
                                        Source={StaticResource employeeinfocollection}}" 
                            DisplayMemberPath="CountryName"
                            SelectedValuePath="CountryCode"
                            HeaderText="Country">
        </syncfusion:GridComboBoxColumn>
    </syncfusion:SfDataGrid.Columns>
</syncfusion:SfDataGrid>

 

The following is the Converter that returns the GroupKey based on the DisplayMemberPath by using the value (Record) and the parameter (Column) passed.

C#

public class GroupcaptionConverter : IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
        if (!(parameter is GridComboBoxColumn))
                return value;
            var column = parameter as GridComboBoxColumn;
            var record = value as EmployeeInfo;
            foreach (var item in column.ItemsSource)
            {
                if (record.CountryCode == (item as CompanyItem).CountryCode)
                    return (item as CompanyItem).CountryName;
            }
            return null; 
        }
        public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            throw new NotImplementedException();
        }
    }

 

The following screenshot shows the Group Key that is changed based on the DisplayMemberPath.

But, when you group at run time by dragging and dropping the column into the GroupDropArea, you can set the Converter by handling the SfDataGrid.View.GroupDescriptions.CollectionChanged as in the following code example.

C#

this.datagrid.View.GroupDescriptions.CollectionChanged += GroupDescriptions_CollectionChanged; 
void GroupDescriptions_CollectionChanged(object sender,
System.Collections.Specialized.NotifyCollectionChangedEventArgs e)
{
       if (e.Action== NotifyCollectionChangedAction.Add)
            {
                var group = e.NewItems[0] as PropertyGroupDescription;
                if (group.PropertyName == "CountryCode")
                    group.Converter = new GroupcaptionConverter();
            }
 }


 

C# converter class

public class GroupcaptionConverterMultiColumnDropDownList: IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, string language)
    {
        if (!(parameter is GridMultiColumnDropDownList))
            return value;
        var column = parameter as GridMultiColumnDropDownList;
        var record = value as EmployeeInfo;
        var itemsSource = column.ItemsSource as ObservableCollection<CompanyItem>;
        foreach (var item in itemsSource)
        {
            if (record.CountryCode == (item as CompanyItem).CountryCode)
                return (item as CompanyItem).CountryName;
        }
        return null;
    }
    public object ConvertBack(object value, Type targetType, object parameter, string language)
    {
        throw new NotImplementedException();
    }
}

Did you find this information helpful?
Yes
No
Help us improve this page
Please provide feedback or comments
Comments (0)
Please  to leave a comment
Access denied
Access denied