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

Child grid ClientFooterTemplate data references parent

1 Answer 368 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Chris
Top achievements
Rank 1
Chris asked on 08 Nov 2017, 05:41 PM

Hi,

I'm having an issue with a hierarchical grid using ASP.NET MVC5 where I can't seem to access the child grid data in any client templates.

My overall goal is to be able to put an aggregated max value in the ClientFooterTemplate of the first column.

Here's my cut down grid code:

01.@(Html.Kendo().Grid<XXViewModel>()
02.    .Name("XXGrid")
03.    .EnableCustomBinding(true)
04.    .AutoBind(true)
05.    .DataSource(ds => ds
06.        .Ajax()
07.        .Read(r => r.Action("XX_Read", "XX")
08.        .ServerOperation(true)
09.    )
10.    .Events(ev =>
11.    {
12.        ev.DetailExpand("detailExpand");
13.        ev.DetailCollapse("detailCollapse");
14.    })
15.    .Columns(c =>
16.    {
17.        c.Bound(m => m.XXId);
18.        c.Bound(m => m.FirstName);
19.        c.Bound(m => m.Surname);
20.    })
21.    .ClientDetailTemplateId("xx-detail-template")
22.)
23. 
24.<script id="xx-detail-template" type="text/x-kendo-template">
25.    <div class="xx-detail-template">
26.        <div class="xx-detail-child-grid" style="width: 1140px">
27.            @(Html.Kendo().Grid<YYViewModel>()
28.                  .Name("ChildGrid_#=XXId#")
29.                  .Columns(c =>
30.                  {
31.                      c.Bound(m => m.Channel)
32.                          .Title("Channel")
33.                          .ClientFooterTemplate("Last refreshed: #=data.ImportedDate.max#")
34.                          .Width(140);
35.                      c.Bound(m => m.SentDate)
36.                          .Title("Sent")
37.                          .Format("{0:yyyy/MM/dd HH:mm}")
38.                          .Width(140);
39.                  })
40.                  .DataSource(ds => ds
41.                      .Ajax()
42.                      .Read(r => r.Action("XXChild_Read", "XX", new {attendeeId = "#=XXId#"}))
43.                      .Aggregates(a => a.Add(m => m.ImportedDate).Max())
44.                      .Sort(s => s.Add(m => m.SentDate).Descending()))
45.                  .ToClientTemplate()
46.                  )
47.        </div>
48.    </div>
49.</script>

 

A javascript error is being raised from line 33 of the above snippet: data.ImportedDate is undefined. Upon inspection I can see that data is referencing the datasource of the parent grid. How do I access the child grid's datasource in the client templates?

 

 

1 Answer, 1 is accepted

Sort by
0
Stefan
Telerik team
answered on 10 Nov 2017, 12:06 PM
Hello, Chris,

The issue occurs because the context is different.

It can be resolved by escaping the template in order to receive the correct context:

.ClientFooterTemplate("\\#=customFunction(data)\\#")

A similar approach can be observed in our demo:

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

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