Custom Aggregate in ASP.NET CORE Tree Grid Component

21 Dec 20222 minutes to read

To calculate the aggregate value with your own aggregate functions, use the custom aggregate option. To use custom aggregation, specify the type as Custom, and provide the custom aggregate function in the customAggregate property.

@{
    object customAggregateFn = "customAggregateFn";
}

<ejs-treegrid id="TreeGrid" dataSource="@ViewBag.datasource" height="260" childMapping="subTasks" treeColumnIndex="0">
    <e-treegrid-aggregates>
        <e-treegrid-aggregate>
            <e-treegrid-aggregate-columns>
                <e-treegrid-aggregate-column columnName="category" type="Custom" customAggregate="customAggregateFn" footerTemplate="Count of Frozen seafood : ${Custom}"></e-treegrid-aggregate-column>
            </e-treegrid-aggregate-columns>
        </e-treegrid-aggregate>
    </e-treegrid-aggregates>
    <e-treegrid-columns>
        <e-treegrid-column field="category" headerText="Category" width="130"></e-treegrid-column>
        <e-treegrid-column field="units" headerText="Total Units" textAlign="Right" width="195"></e-treegrid-column>
        <e-treegrid-column field="unitPrice" headerText="Unit Price($)" format="C2" textAlign="Right" width="130"></e-treegrid-column>
        <e-treegrid-column field="price" headerText="Price($)" textAlign="Right" width="125"></e-treegrid-column>
    </e-treegrid-columns>
</ejs-treegrid>

<script>
    function customAggregateFn(data) {
        var sampleData = ej.base.getValue('result', data);
        var countLength; countLength = 0;
        sampleData.filter(function (item) {
            var data = ej.base.getValue('category', item);
            if (data === 'Frozen seafood') {
                countLength++;
            }
        });
        return countLength;
    };
</script>
public IActionResult Index()
{
    ViewBag.datasource = TreeSummaryData.GetData();
    return View();
}

NOTE

To access the custom aggregate value inside the template, use the key as Custom.

You can refer to our ASP.NET Core Tree Grid feature tour page for its groundbreaking feature representations. You can also explore our ASP.NET Core Tree Grid example ASP.NET Core Tree Grid example to knows how to present and manipulate data.