Grid Grouping not showing the ClientGroupHeaderColumnTemplate

[n/a]

I'm trying the grouping in Grid I want to display the sum of the column as ClientGroupHeaderColumnTemplate  or ClientHeaderTemplate but doesn't  seem to be working, it only shows as a ClientFooterTemplate. :

@(Html.Kendo().Grid<Models.DepartmentSummaryView> ()
        .Name("grid")
        .HtmlAttributes(new { style = " height:700px !important;" })
        .Columns(columns =>
        {
            columns.Bound(p => p.DepartmentNo).Width(150).ClientGroupHeaderTemplate("Department: #= value # (Products: #= count#)");
            columns.Bound(p => p.DepartmentName).Width(150).ClientGroupHeaderTemplate("Department: #= value # (Products: #= count#)");
            columns.Bound(p => p.ProductNo).Width(150).ClientGroupHeaderTemplate("Product: #= value # (Count: #= count #)");
            columns.Bound(p => p.ProductName).Width(150);
            columns.Bound(p => p.SKU).Width(150);
            columns.Bound(p => p.Qty).Width(150).ClientGroupHeaderColumnTemplate("Sum: #= sum #").ClientFooterTemplate("Sum: #= sum #");
        })
        .Filterable(filterable => filterable.Extra(false)
        //.Mode(GridFilterMode.Row)
        .Operators(operators => operators
        .ForString(str => str.Clear()
        .StartsWith("Starts with")
        .EndsWith("Ends with")
        .IsEqualTo("Is equal to")
        .IsNotEqualTo("Is not equal to")
        .Contains("Contains")
        .DoesNotContain("Doesn't contain")
        )))
        //.Pageable()
        .Navigatable()
        .AutoBind(false)
        .Sortable()
        .Groupable()
        .Events(events => events.DataBound("onDataBound"))
        .Reorderable(reorderable => reorderable.Columns(true))
        .DataSource(dataSource => dataSource
        .Custom()
        .Schema(schema =>
        {
            schema.Data("Data");
            schema.Total("Total");
        })
        .Events(events => events.Sync("sync_handler"))
        .Group(groups => groups.Add(p => p.DepartmentNo))
        .Aggregates(aggregates =>
        {
            aggregates.Add(p => p.DepartmentNo).Count();
            aggregates.Add(p => p.DepartmentName).Count();
            aggregates.Add(p => p.ProductNo).Count();
            aggregates.Add(p => p.SKU).Count();
            aggregates.Add(p => p.Qty).Sum();
        })
        .Transport(transport =>
        {

            transport.Read(read =>
                read.Url("/api/enquiries/departmentsummary)
                .DataType("json")

                .Type(HttpVerbs.Get)
                );
                            transport.Create(create =>
                create.Url(Base.APIHostAddress + "/api/enquiries/post")
                .DataType("json")
                .Type(HttpVerbs.Post)
                .ContentType("application/json; charset=utf-8")

                );

                transport.ParameterMap("parameterMap");
        })
        )
)

 

[Konstantin Dikov]

Hello Adam,

For displaying the aggregates in the group header you should configure the ClientGroupHeaderColumnTemplate:

• https://docs.telerik.com/kendo-ui/api/javascript/ui/grid/configuration/columns.groupheadercolumntemplate

Here is a dojo example with the result:

• https://dojo.telerik.com/eVUdUmUh

You can also refer to the following online demo, where all options for the aggregates are demonstrated:

• https://demos.telerik.com/aspnet-mvc/grid/aggregates

Hope this helps.


Regards,
Konstantin Dikov
Progress Telerik

[n/a]

Hey Konstantin 

From the above code that i provided how can i make the displaying of aggregates using ASP.NET Core MVC work. i followed This Example

but it not  working as it should be, am i configuring it wrong or am i missing something?

[Konstantin Dikov]

Hi Adam,

The same demo is available for the UI for ASP.NET Core suite:

• https://demos.telerik.com/aspnet-core/grid/aggregates

Could you please open a regular support ticket and attach a sample, runnable project demonstrating the issue that you are facing, so we can test and debug it locally?

Meanwhile, you could inspect the Network tab in the browser's developer tools window to see if the aggregates for the groups are correctly returned by the Read request. You can also check out the browser's console for any JavaScript errors.


Regards,
Konstantin Dikov
Progress Telerik