This is a migrated thread and some comments may be shown as answers.

Can the groupFooterTemplate contain the sum of another column's values?

6 Answers 1062 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Tim R
Top achievements
Rank 1
Tim R asked on 14 Jun 2013, 07:35 PM
Are there any built-in Kendo aggregate functions that can be called in the groupFooterTemplate?

Let's say I have detail data showing customer purchase orders:


       AcmeWidgets...................................$200.00
       ZooAnimals.......................................$500.00
       ZooAnimals.......................................$400.00
       AcmeWidgets....................................$450.00
       GizmoUniverse.................................$700.00

When I group on company name is it possible to show in the groupFooterTemplate the sum() of the dollar amounts for each customer, e.g.:

        AcmeWidgets.................................$650.00
        ZooAnimals.....................................$900.00
        GizmoUniverse...............................$700.00






6 Answers, 1 is accepted

Sort by
0
Iliana Dyankova
Telerik team
answered on 18 Jun 2013, 03:36 PM
Hi Tim,

In order to achieve the desired result you should define the "sum" aggregate for the "Amounts" column. For working example take a look at this online demo, where "count" and "average" aggregates are defined.

Regards,
Iliana Nikolova
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Tim R
Top achievements
Rank 1
answered on 21 Jun 2013, 08:09 PM
 I keep getting the error that "sum" is undefined.

Is there a simple example of a single aggregation instead of one where multiple aggregations are going on and there isn't a lot of nesting?  And an example that  isn't deliberately designed to confuse by being inside-out? Who aggregates by quantity on hand?  Quantity on hand is usually the value displayed in the footer when one is aggregating by Product.


0
Iliana Dyankova
Telerik team
answered on 25 Jun 2013, 05:33 PM
Hello Tim,

Please take a look at this jsBin example which I prepared for you - it demonstrates only "sum" aggregation for the "UnitPrice" field.

Regards,
Iliana Nikolova
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Tim R
Top achievements
Rank 1
answered on 25 Jun 2013, 06:40 PM
Could you please show me, using that dataset, how to produce the following output, where, initially, the grid is not yet grouped, but is groupable by CategoryID.  When the CategoryID field is dragged up to the Group Panel, I would like to see the CategoryID in the group header and the sum of units on hand and the sum of units on order in the group footer for each category.  

Important:
The grid should start out not yet grouped, but be groupable by CategoryID using drag to group panel.
 The Category ID value should appear only once after grouping, not be repeated.
The string "drag a column here to group by that column" should disappear when the grid is in grouped state.
There should be only two columns visible after grouping, the Units in Stock and Units on Order.

CategoryID...........Units In Stock........Units On Order
  1                                   ...
....................................... ###....................................###.
  2
....................................... ###....................................###.
   3
....................................... ###....................................###.

Code is in next reply.  But I cannot get it to show the aggregate sums unless I also show the detail.
0
Tim R
Top achievements
Rank 1
answered on 26 Jun 2013, 02:50 PM
I've got it working better but I have not yet been able to figure out how to suppress the detail while showing the aggregate sum; closing the group panel hides the group footer.  It it possible to see the aggregate counts without the detail?

$("#grid").kendoGrid({
  dataSource: {
    type: "odata",
    transport: {
      read: "http://demos.kendoui.com/service/Northwind.svc/Products"
    },
    schema: {
      model: {
        id: "ProductID",
        fields: {          
          CategoryID: {editable: false},          
          UnitsOnOrder: {type: "number" },        
          UnitsInStock: { type: "number", validation: { min: 0, required: true } }
        }
      }
    },
    pageSize: 25
  },
  
  sortable: true,
  scrollable: false,
  groupable: true,
  pageable: true,
  columns: [    
    { field: "CategoryID", groupable: true},
    { field: "UnitsOnOrder", title: "Units On Order",groupFooterTemplate: "on order: #= data.UnitsOnOrder.sum # ", aggregates: ["sum"]},
    { field: "UnitsInStock", title: "Units In Stock",groupFooterTemplate: "in stock: #= data.UnitsInStock.sum # " , aggregates: ["sum"]}
  ]
});
0
Iliana Dyankova
Telerik team
answered on 27 Jun 2013, 05:56 PM
Hi Tim,

I am afraid showing the aggregate "sum" when the group is closed is not supported by Kendo UI Grid. Actually this idea has been already submitted as a feature request at our UserVoice portal, so if you wish you may cast a vote, leave a comment or monitor the community's interest in it here. The more votes the suggestion collects, the higher priority will have.

Meanwhile as possible workarounds I can suggest:

  • Define footerTemplate which will be available and when the groups are collapsed. Note that in order to display aggregates you should define them in the DataSource's configuration: 
    $("#grid").kendoGrid({
      dataSource: {
        //....
         aggregate: [
            { field: "ProductName", aggregate: "sum" },
            { field: "UnitPrice", aggregate: "sum"},
            { field: "UnitsOnOrder", aggregate: "sum" },
            { field: "UnitsInStock", aggregate: "sum" }
        ]
      },
      //...
    });
  • Use groupHeaderTemplate, however keep in mind only the aggregates from the grouped column can be displayed in the groupHeaderTemplate. 

Regards,
Iliana Nikolova
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Tags
Grid
Asked by
Tim R
Top achievements
Rank 1
Answers by
Iliana Dyankova
Telerik team
Tim R
Top achievements
Rank 1
Share this question
or