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

Aggregates with dynamic grouping

5 Answers 177 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Bernd
Top achievements
Rank 2
Bernd asked on 15 Apr 2017, 07:21 PM

Hi all.

In den Kendo UI docs there is a sample which I would like to use with the MVC wrapper.

But I have no idea how to tell a grid column to have aggregates. Like it is done in the docs.

Any ideas?

Kind regards

Bernd

5 Answers, 1 is accepted

Sort by
0
Stefan
Telerik team
answered on 18 Apr 2017, 11:28 AM
Hello Bernd,

I can assume that due to a technical issue to linked sample is send to us only as text.

Could you please share the mentioned example, so I can inspect it and try to provide a suggestion on how it may be achieved using the MVC wrappers.

Thank you in advance.

Regards,
Stefan
Telerik by Progress
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data (charts) and form elements.
0
Bernd
Top achievements
Rank 2
answered on 18 Apr 2017, 03:56 PM
I am sorry. Try this link in your docs. http://docs.telerik.com/kendo-ui/api/javascript/ui/grid#configuration-columns.aggregates
0
Stefan
Telerik team
answered on 19 Apr 2017, 06:18 AM
Hello Bernd,

When using the Kendo UI for MVC the linked property is not required.

Please check our demo of the Grid with aggregates using the MVC version:

http://demos.telerik.com/aspnet-mvc/grid/aggregates

I hope this is helpful.

Regards,
Stefan
Telerik by Progress
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data (charts) and form elements.
0
Bernd
Top achievements
Rank 2
answered on 19 Apr 2017, 08:54 AM

Hello Stefan.

Thank you for the link. I tried it, but it doesn't work as expected. The grid groups but there are no headers or footers with sums. As you can see in the following code sample I tried it several ways.

This is my grid definition:

001.@(Html.Kendo().Grid<CalendarEventViewModel>()
002.    .Name(componentName: "eventGrid")
003.    .AutoBind(value: false) // will be bound manually
004.    .Pageable(p => { p.PageSizes(enabled: true); p.Refresh(enabled: true); p.Enabled(value: true); })
005.    .Scrollable(s => { s.Height(value: "auto"); s.Enabled(value: true); })
006.    .Filterable(f => f.Mode(GridFilterMode.Row))
007.    .Groupable()
008.    .Selectable()
009.    .Sortable(s => s.Enabled(value: true))
010.    .Resizable(r => r.Columns(value: true))
011.    .Reorderable(r => r.Columns(value: true))
012.    .ColumnMenu(m => { m.Filterable(value: false); m.Enabled(value: true); })
013.    .Editable(editable => { editable.TemplateName(templateName: "CalendarEventEditorTemplate"); })
014.    .ToolBar(tb => tb.Excel())
015.    .Columns(columns => {
016.        columns.Bound(c => c.Operation.OperationIdFormatted)
017.            .Filterable(f => f.Cell(c => c.Operator(defaultOperator: "contains")))
018.            .Groupable(value: false)
019.            .Sortable(value: false)
020.            .Width(pixelWidth: 160)
021.        columns.Bound(nameof(CalendarEventViewModel.Title))
022.            .Filterable(f => f.Cell(c => c.Operator(defaultOperator: "startswith")))
023.            .Width(pixelWidth: 250)
024.        columns.Bound(c => c.Operation.WorkOrder.EndProduct.ArticleNumber)
025.            .Width(pixelWidth: 160)
026.            .Filterable(f => f.Cell(c => c.Operator(defaultOperator: "startswith")))
027.            .ClientGroupHeaderTemplate(value: "Artikel: #=value# - zu produzieren: #=aggregates.QuantityToProduce.sum#")
028.        columns.Bound(c => c.Operation.WorkOrder.EndProduct.Dimensions)
029.            .Width(pixelWidth: 130)
030.            .Filterable(f => f.Cell(c => c.Operator(defaultOperator: "startswith")))
031.        columns.Bound(c => c.Operation.WorkOrder.EndProduct.Height)
032.            .Width(pixelWidth: 100)
033.        columns.Bound(c => c.Operation.WorkOrder.EndProduct.Width)
034.            .Width(pixelWidth: 100)
035.        columns.Bound(c => c.Operation.WorkOrder.EndProduct.Length)
036.            .Width(pixelWidth: 100)
037.        columns.Bound(c => c.Operation.TotalTimeSpan)
038.            .Width(pixelWidth: 130)
039.            .ClientTemplate(value: "#= formatTimeSpan(Operation.TotalTimeSpan)#")
040.            .Sortable(value: false)
041.        columns.Bound(c => c.QuantityToProduce).Format(value: "{0:n}")
042.            .Width(pixelWidth: 100)
043.            .Filterable(value: false)
044.            .Groupable(value: false)
045.            .ClientFooterTemplate(template: "zu produzieren: #=sum#")
046.            .ClientGroupFooterTemplate(template: "zu produzieren: #=sum#")
047.            .ClientGroupHeaderTemplate(value: "zu produzieren: #=sum#")
048.        columns.Bound(c => c.Operation.WorkOrder.UnitOfMeasure.Label)
049.            .Width(pixelWidth: 60)
050.            .Filterable(value: false)
051.            .ClientTemplate(value: "#:data.Operation.WorkOrder.UnitOfMeasure.Label.substr(0,data.Operation.WorkOrder.UnitOfMeasure.Label.indexOf(' '))#")
052.        columns.Bound(c => c.Operation.AllowedWorkplaces)
053.            .Width(pixelWidth: 230)
054.            .Filterable(value: false)
055.            .ClientTemplate(value: "#=workplacesTemplate(Operation.AllowedWorkplaces)#")
056.        columns.Bound(c => c.Operation.WorkOrder.Customer.Name)
057.            .Width(pixelWidth: 100)
058.            .Filterable(value: false)
059.            .ClientTemplate(value: "#=Operation.WorkOrder.Customer ? Operation.WorkOrder.Customer.Name : ''#")
060.        columns.Bound(c => c.Operation.WorkOrder.MasterSystemCustomerOrderRef)
061.            .Width(pixelWidth: 100)
062.            .Filterable(value: false)
063.        columns.Bound(nameof(CalendarEventViewModel.Start))
064.            .Width(pixelWidth: 160)
065.            .Format(value: "{0:g}")
066.        columns.Bound(nameof(CalendarEventViewModel.End))
067.            .Width(pixelWidth: 160)
068.            .Format(value: "{0:g}")
069.        columns.Bound(nameof(CalendarEventViewModel.Description))
070.            .Width(pixelWidth: 200)
071.            .Filterable(f => f.Cell(c => c.Operator(defaultOperator: "contains")))
072.        columns.Bound(c => c.Operation.WorkOrder.OrderType.Id).Hidden()
073.            .ClientTemplate(value: "#=Operation.WorkOrder.OrderType.Label#");
074.    })
075.    .DataSource(ds => ds
076.        .SignalR()
077.        .PageSize(pageSize: 10)
078.        .Events(ev => ev.Push(handler: "onPush"))
079.        .Filter(f => f.Add(ce => ce.Workplace.UnlimitedCapacity).IsEqualTo(value: true))
080.        .Transport(tr => tr
081.            .ParameterMap(handler: "addGridParameters")
082.            .Promise(handler: "hubStart")
083.            .Hub(handler: "schedulerHub")
084.            .Client(c => c
085.                .Read(method: "read")
086.                .Create(method: "create")
087.                .Update(method: "update")
088.                .Destroy(method: "destroy"))
089.            .Server(s => s
090.                .Read(method: "unscheduledOperationEvents")
091.                .Update(method: "updateWithScheduling"))
092.            )
093.            .Schema(schema => schema
094.                .Data(data: "Data")
095.                .Model(m => {
096.                    m.Id(f => f.Id);
097.                    m.Field(f => f.Id).Editable(enabled: false);
098.                    m.Field(f => f.StartWeek);
099.                    m.Field(f => f.EndWeek);
100.                    m.Field(f => f.ActivityStatus);
101.                    m.Field(f => f.Description);
102.                    m.Field(f => f.End);
103.                    m.Field(f => f.EndTimezone);
104.                    m.Field(f => f.EventType);
105.                    m.Field(f => f.IsAllDay);
106.                    m.Field(f => f.Operation);
107.                    m.Field(f => f.OperationId);
108.                    m.Field(f => f.Recurrence);
109.                    m.Field(f => f.RecurrenceException);
110.                    m.Field(f => f.RecurrenceID);
111.                    m.Field(f => f.RecurrenceRule);
112.                    m.Field(f => f.Start);
113.                    m.Field(f => f.StartTimezone);
114.                    m.Field(f => f.Status);
115.                    m.Field(f => f.Title);
116.                    m.Field(f => f.Workplace);
117.                    m.Field(f => f.WorkplaceId);
118.                })
119.            )
120.            .Aggregates(agg => {
121.                agg.Add(ce => ce.QuantityToProduce).Sum();
122.            })
123.            .Events(e => e.Error(handler: "scheduler_error"))
124.    )
125.    .ClientDetailTemplateId(id: "operationDetailTemplate")
126.    .Events(e => {e.DataBound(handler: "onGridDataBound"); e.Change(handler: "dispatcher.onGridChange"); })
127.    .Deferred()

What am I missing?

Kind regards

Bernd

0
Stefan
Telerik team
answered on 21 Apr 2017, 07:01 AM
Hello Bernd,

I noticed that the used syntax for the aggregates column is:

.ClientFooterTemplate(template: "zu produzieren: #=sum#")

As in the example, the syntax is:

.ClientFooterTemplate("Sum: #= sum#</div>");

Also, I can suggest using the aggregate method of the dataSource, to check if there are any aggregates currently set:

http://docs.telerik.com/kendo-ui/api/javascript/data/datasource#methods-aggregate

Please check the required syntax and if the issue still occurs, please send a runnable example reproducing the issue, so I can investigate further.

Regards,
Stefan
Telerik by Progress
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data (charts) and form elements.
Tags
Grid
Asked by
Bernd
Top achievements
Rank 2
Answers by
Stefan
Telerik team
Bernd
Top achievements
Rank 2
Share this question
or