Sub total row to show percentages in groupFooter

Hi,

I have ej2-angular-grid version - 18.4.49. Our Angular version is Angular 9.1.1.

We have a unique requirement to (see the screenshot) - 

  1. Display a Net Sales figure in the groupFooterTemplate of Hours worked column. FYI. Net sales value is provided from an API, it is unrelated to Hours Worked column, and is NOT worked out from HoursWorked column.
  2. The groupFooter of Shift Pay column needs to show a percentage of NetSales. something like SUM(ShiftPay)x100/NetSalesValue with a % symbol.


Is this possible or is there a work around. Please advise.

Thanks
Jais.


1 Reply

PS Pavithra Subramaniyam Syncfusion Team April 13, 2022 03:39 PM UTC

Hi Mr J GEORGE,


Thanks for contacting Syncfusion support.


You can achieve your requirement by using the “Custom Aggregate” feature of the Grid component. Using this you can do the calculations as per your requirement and return the value which will be displayed in the summary cell. Please refer to the below code example and Documentation link for more information.


 

@Component({

  selector: 'app-root',

  template: `<ejs-grid [dataSource]='data' height='268px'>

    .  .  .

    <e-aggregates>

        <e-aggregate>

            <e-columns>

                <e-column columnName="ShipCountry" format="P" type="Custom" [customAggregate]="customAggregateFn">

                    <ng-template #footerTemplate let-data>Brazil Count: {{data.Custom}}</ng-template>

                </e-column>

            </e-columns>

        </e-aggregate>

    </e-aggregates>

</ejs-grid>`

})

export class AppComponent implements OnInit {

 

  public data: object[];

  public ShipCountry = 'ShipCountry';

  ngOnInit(): void {

    this.data = data;

  }

  public customAggregateFn = (sdata: ReturnType) =>

    sdata.result.filter((item: object) => item[this.ShipCountry] === 'Brazil').length

}

 

 


Documentation: https://ej2.syncfusion.com/angular/documentation/grid/aggregates/custom-aggregate/


Please get back to us if you need further assistance on this.


Regards,

Pavithra S


Loader.
Up arrow icon