Add custom aggregation type to the menu in ASP.NET CORE Pivot Table Component

2 Aug 20234 minutes to read

By using the dataBound event, you can add your own custom aggregate type(s) to the pivot table’s aggregate menu.

In the following example, we have added the aggregation types CustomAggregateType 1 and CustomAggregateType 2 to the aggregate menu. The calculation for those aggregated types can be done using the aggregateCellInfo event.

<ejs-pivotview id="pivotview" height="300" dataBound="onDataBound" aggregateCellInfo="aggregateCell" showFieldList="true">
    <e-datasourcesettings dataSource="@ViewBag.DataSource" expandAll="false">
        <e-formatsettings>
            <e-field name="Amount" format="C0"></e-field>
        </e-formatsettings>
        <e-rows>
            <e-field name="Country"></e-field>
            <e-field name="Products"></e-field>
        </e-rows>
        <e-columns>
            <e-field name="Year" caption="Year"></e-field>
            <e-field name="Quarter"></e-field>
        </e-columns>
        <e-values>
            <e-field name="Sold" caption="Units Sold"></e-field>
            <e-field name="Amount" caption="Sold Amount"></e-field>
        </e-values>
    </e-datasourcesettings>
</ejs-pivotview>
<script>
    var SummaryType = [
        'Sum',
        'Count',
        'DistinctCount',
        'Avg',
        'CustomAggregateType1',
        'CustomAggregateType2'
    ];
    var L10n = ej.base.L10n;
    L10n.load({
       'en-US': {
            pivotview: {
                CustomAggregateType1: 'Custom Aggregate Type 1',
                CustomAggregateType2: 'Custom Aggregate Type 2',
            },
            pivotfieldlist: {
                CustomAggregateType1: 'Custom Aggregate Type 1',
                CustomAggregateType2: 'Custom Aggregate Type 2',
            }
        }
    });
    function onDataBound() {
        var pivotObj = document.getElementById('pivotview').ej2_instances[0];
        pivotObj.getAllSummaryType = function () {
            return SummaryType;
        };
        pivotObj.pivotFieldListModule.aggregateTypes = SummaryType;
        pivotObj.pivotFieldListModule.getAllSummaryType = function () {
            return SummaryType;
        };
    }
     function aggregateCell(args){
        if (args.aggregateType === 'CustomAggregateType1') {
            args.value = args.value * 100;
        }
        if (args.aggregateType === 'CustomAggregateType2') {
            args.value = args.value / 100;
        }
    }
</script>
public ActionResult Index()
{
    var data = GetPivotData();
    ViewBag.DataSource = data;
    return View();
}

Add custom aggregation type to the menu