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

Aspnet Core Nested Grid aggregates not working

1 Answer 72 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Matt Bowser
Top achievements
Rank 1
Veteran
Matt Bowser asked on 03 Nov 2020, 03:09 PM

Good morning, 

I'm new to Telerik and doing a POC evaluation using the Aspnet Core Grid control to see if it will work for our situation.  I've worked through most issues along the way, but I'm unable to get aggregates to work on the grid so far and I'm hoping it's something simple I'm missing and not a limitation of aggregates within a nested grid hierarchy. 

Here is the scenario:

I am trying to do a simple count of items in the nested grid and place them using the .ClientGroupHeaderColumnTemplate.  I'm also adding the .Aggregates to the DataSource call.  When I do so, I am unable to access the grid and get the following javascript error:  "Uncaught ReferenceError: count is not defined"

I believe I have followed all the demos/examples/threads that I've found online correctly, but the difference is that this grid is nested within 2 other grids. I have also tried several of the other ClientTemplates (footer, header, etc...) with the same result.  Thanks in advance for any help you can give and let me know if you need additional information.

Here is the code I'm calling for this grid:

<script id="agents" type="text/kendo-tmpl">
    @(Html.Kendo().Grid<TLCAgentSchedulerT.Models.AgentViewModel>
    ()
    .Name("agent_#=SubPodId#")
    .Columns(columns =>
    {

        columns.Bound(o => o.AgentName).Width(50);
        columns.Bound(o => o.Block1).Width(4)
            .ClientGroupHeaderColumnTemplate("Sum: #= count#")
            .ClientTemplate(@"<div class='agentStatus' style='background-image: url(" + @Url.Content("~/images/\\#:data.Block1\\#.png") + ");'></div>").ClientHeaderTemplate("<span data-toggle='tooltip' data-placement='top' title='6:00 AM EST'>B1</span>");
        columns.Bound(o => o.Block2).Width(4).ClientTemplate(@"<div class='agentStatus' style='background-image: url(" + @Url.Content("~/images/\\#:data.Block2\\#.png") + ");'></div>").ClientHeaderTemplate("<span data-toggle='tooltip' data-placement='top' title='6:00 AM EST'>B2</span>");
        columns.Bound(o => o.Block3).Width(4).ClientTemplate(@"<div class='agentStatus' style='background-image: url(" + @Url.Content("~/images/\\#:data.Block3\\#.png") + ");'></div>").ClientHeaderTemplate("<span data-toggle='tooltip' data-placement='top' title='6:00 AM EST'>B3</span>");
        columns.Bound(o => o.Block4).Width(4).ClientTemplate(@"<div class='agentStatus' style='background-image: url(" + @Url.Content("~/images/\\#:data.Block4\\#.png") + ");'></div>").ClientHeaderTemplate("<span data-toggle='tooltip' data-placement='top' title='6:00 AM EST'>B4</span>");
        //Add Additional Blocks

        columns.Command(command =>
        {
            command.Edit().Text("Edit Agent");
        }).Width(25);
    })
    .DataSource(dataSource => dataSource
        .Ajax()
        //.Read(read => read.Action("EditAgent", "Grid"))
        .Update(update => update.Action("EditAgent", "Grid"))
        .Events(events => events.Error("error_handler"))
        .Aggregates(aggregates =>
        {
            aggregates.Add(p => p.Block1).Count();
        })
        .Group(groups => groups.Add(p=> p.Block1))
        .PageSize(5)
        .Read(read => read.Action("GetAgents", "Grid", new { subPodId = "#=SubPodId#" }))
        )
        //.ToolBar(toolbar => toolbar.Create()) //Adds 'Add New Record' button to toolbar
        .Editable(editable => editable.Mode(GridEditMode.PopUp))
        .Scrollable()
        //.Sortable()
        .ToClientTemplate()
    )
</script>

 

 

 

 

1 Answer, 1 is accepted

Sort by
0
Eyup
Telerik team
answered on 06 Nov 2020, 12:53 PM

Hi Matt,

 

Thank you for your interest in the Kendo Grid for Core.

Aggregates are supported and provided built-in:
https://demos.telerik.com/aspnet-core/grid/aggregates

What I can suggest you do is the following:

1. Set this property to false:

    .DataSource(dataSource => dataSource
          .Ajax()
          .ServerOperation(false)
2. If the issue remains, bring the grid temporarily outside any templates and put it directly on the page. Then, remove the .ToClientTemplate() method and ensure that the grid is working as expected.

3. If the issue remains even after step 2, send me the definition of all the three grids and I will prepare a working solution and send it to you.

 

Regards,
Eyup
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Tags
Grid
Asked by
Matt Bowser
Top achievements
Rank 1
Veteran
Answers by
Eyup
Telerik team
Share this question
or