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

Grouping on custom Column

Thread ID:





150662 Jan 15,2020 09:20 AM UTC Jan 17,2020 07:36 AM UTC React - EJ 2 1
Tags: Grid
Asked On January 15, 2020 09:20 AM UTC

As per title, I am trying to group all rows with a certain value on a custom column, in the documentation I read there is a way to include the Format, is there a way to include the template?

            groupSettings: { columns: ["PhaseId"], showDropArea: false, showUngroupButton: false },
            columns: [
                { field: "AssemblyId", visible: false, isPrimaryKey: true },
                { field: "AuditSequenceSequenceId", headerText: "SequenceId", isPrimaryKey: true },
                { field: "AuditAuditId", visible: false, isPrimaryKey: true },
                { field: "AuditSequenceResourcesItalianText", headerText: "Description", width: 500 },
                { field: "AuditLaps", headerText: "Laps" },
                { field: "AuditApplicationId", headerText: "Application", dataSource: this.ApplicationData, foreignKeyValue: "ApplicationName", foreignKeyField: "ApplicationId", query: this.ApplicationQuery },
                //{ field: "PhaseId", headerText: "Phase", dataSource: this.PhaseData, foreignKeyValue: "ResourcesItalianText", foreignKeyField: "PhaseId", query: this.PhaseQuery },
                { field: "PhaseId", headerText: "Phase", template: this.phaseTemplate },
                { field: "LineId", headerText: "Line", dataSource: this.LineData, foreignKeyValue: "ResourcesItalianText", query: this.LineQuery },
                { field: "Priority", headerText: "Priority" },

I attached a screenshot of the situation.

Attachment: Cattura_2318f28e.zip

Balaji Sekar [Syncfusion]
Replied On January 17, 2020 07:36 AM UTC

Hi Matteo, 

Greetings from the Syncfusion support, 

Query:  Is there a way to include the template in the Group summary? 

Yes, We suggest you to use the “custom helper function” to achieve a client side callback to change the Group caption header. In the below code we have defined a custom helper function, hence while defining the group caption header of Grid every time the function will be triggered to display the customized text. Please refer the code example below, 

constructor() { 
        this.groupOptions = { showDropArea: false, captionTemplate: 'Group Label -${customhelper(data)}', columns: ['Computed'] }; 
       window.customhelper= function(data){ 
           return data.items[0].EmployeeID + "available"; //The returned value will be displayed in group caption header 
We have also shared the sample for your convenience. Please refer the sample link below, 
Please get back to us if you need further assistance. 
Balaji Sekar. 


This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

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

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
Live Chat Icon