Telerik Forums / Kendo UI for jQuery
This is a migrated thread and some comments may be shown as answers.

[Solved] groupFooterTemplate doesn't works in multiple groups (subgrups)

1 Answer 189 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Jens
Top achievements
Rank 1
Jens asked on 07 Nov 2014, 09:16 AM
Hello,

is it possible to use the groupFooterTemplate with multiple group? It seems like only the footertemplate works.
Here is an example. I want to display the count in every group and subgroup, e.g. employees -> female -> count=2 and also employee -> count=4

01.<!DOCTYPE html>
02.<html>
03.<head>
04.    <meta charset="utf-8">
05.    <title>Kendo UI Snippet</title>
06. 
08.    <link rel="stylesheet" href="http://cdn.kendostatic.com/2014.2.716/styles/kendo.rtl.min.css">
13. 
14.    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
16.</head>
17.<body>
18.   
19.<div id="grid"></div>
20.<script>
21.$("#grid").kendoGrid({
22.  columns: [
23.    { field: "name"},
24.    { field: "typ", footerTemplate: "Employees Total: #=count#"},  //Works fine
25.    //{ field: "typ", footerTemplate: "Employees Total: #=count#", groupFooterTemplate: "Count: #=count#"}, //Doesn't work :-(
26.    { field: "gender" },
27.    { field: "age" }  
28.     
29.  ],
30.  dataSource: {
31.    data: [
32.      { name: "Jane Doe", age: 30, typ: "customer", gender: "female"},
33.      { name: "John Doe", age: 32, typ: "customer", gender: "male" },
34.      { name: "Jodi Doe", age: 30, typ: "customer", gender: "female" },
35.      { name: "Jim Doe", age: 32, typ: "customer", gender: "male" },
36.       
37. 
38.      { name: "jens", age: 34, typ: "employee", gender: "male" },
39.      { name: "Anna", age: 36, typ: "employee", gender: "female" },
40.      { name: "Karl", age: 34, typ: "employee", gender: "male" },
41.      { name: "Gustav", age: 36, typ: "employee", gender: "female" }
42.    ],
43.     
44.    group: [{field: "typ", aggregate:"count"},{field: "gender", aggregate:"count"}],
45.     
46.    aggregate: { field: "typ", aggregate: "count" }
47.             
48.  }
49.});
50.</script>
51.</body>
52.</html>


Thanks in advance

Kind regards

Jens Borowy

1 Answer, 1 is accepted

Sort by
0
Jens
Top achievements
Rank 1
answered on 07 Nov 2014, 09:41 AM
Hello,

I found it by myself. You need to use the "aggregates" for each group.
This works fine:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Kendo UI Snippet</title>
 
 
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
</head>
<body>
   
<div id="grid"></div>
<script>
$("#grid").kendoGrid({
  columns: [
    { field: "name"},
    //{ field: "typ", footerTemplate: "Employees Total: #=count#"},  //Works fine
    { field: "typ", footerTemplate: "Employees Total: #=count#", groupFooterTemplate: "Sub group Total: #=count#"}, //Doesn't work :-(
    { field: "gender" },
    { field: "age" }  
     
  ],
  dataSource: {
    data: [
      { name: "Jane Doe", age: 30, typ: "customer", gender: "female"},
      { name: "John Doe", age: 32, typ: "customer", gender: "male" },
      { name: "Jodi Doe", age: 30, typ: "customer", gender: "female" },
      { name: "Jim Doe", age: 32, typ: "customer", gender: "male" },
       
 
      { name: "jens", age: 34, typ: "employee", gender: "male" },
      { name: "Anna", age: 36, typ: "employee", gender: "female" },
      { name: "Karl", age: 34, typ: "employee", gender: "male" },
      { name: "Gustav", age: 36, typ: "employee", gender: "female" }
    ],
     
    group: [
                {field: "typ", aggregates:
            [
            { field: "typ", aggregate: "count" },
            { field: "gender", aggregate: "count" },
            { field: "age", aggregate: "average" },
            { field: "name", aggregate: "count" }]
                    },
       
                    {field: "gender", aggregates:
            [
            { field: "typ", aggregate: "count" },
            { field: "gender", aggregate: "count" },
            { field: "age", aggregate: "average" },
            { field: "name", aggregate: "count" }]
  }                
],     
             
 
 
    aggregate: { field: "typ", aggregate: "count" }
             
  }
});
</script>
</body>
</html>

Kind regards

Jens
Tags
Grid
Asked by
Jens
Top achievements
Rank 1
Answers by
Jens
Top achievements
Rank 1
Share this question
or