0

I'm struggling with getting a footer, to display totals, on a Kendo Angular Grid which is bound async. to a backend API.

The example on the Kendo website refers to a fixed array and doesn't include any examples (although everything else does !?) of have to achieve this when bound to ASYNC data.

Bhail
  • 710
  • 8
  • 14
  • Can you be specific about what you are struggling? Are you getting errors on the console? Can you share your grid code? – CMartins May 02 '18 at 13:29
  • Thanks...No I simply cant even get a demo working. Is there a demo for aggregates where data is bound to an API async. – Bhail May 02 '18 at 14:11
  • In this example, show how to implement your control with angular async pipe. https://www.telerik.com/kendo-angular-ui/components/dropdowns/autocomplete/data-binding/#toc-async-pipe I hope it will get you into the right direction – CMartins May 02 '18 at 14:53
  • NO ! Kendo Grid...it does aggregates...in the footer it can sum the values in the columns. The example on the Kendo site shows how to sum columns when the datasource is an array. But in the rela life data comes from a database where data is paged. there is no example of how to do aggregages for paged data. – Bhail May 03 '18 at 07:06

1 Answers1

0

You need to grab your Database results into an object (data) independent from you grid data Here you have documentation about aggregateBy https://www.telerik.com/kendo-angular-ui/components/dataquery/api/aggregateBy/

const result = aggregateBy(data, [
      { aggregate: "sum", field: "unitPrice" },
      { aggregate: "sum", field: "unitsInStock" }
    ]);

To get your result use

const result = <AggregateResult>{
     "unitPrice": { "sum": 53, "count": 2 },
     "unitsInStock": { "sum": 66, "count": 3 }
};
CMartins
  • 3,247
  • 5
  • 38
  • 53