Search code examples
kendo-gridkendo-asp.net-mvc

Date formatting on Kendo Grid Group Header

I need to Group a Kendo Grid for every Month data. i am getting date in ISO format as given below.

2020-03-02T00:00:00

This is the column binding and data source grouping

column binding.

 columns.Bound(z => z.MonthDisplay).Title("").Hidden(true).Format("{0:MMMM yyyy}");

data source binding with grouping

.DataSource(dataSource => dataSource
   .PageSize(10)
   .Group(groups => groups.AddDescending(t => t.MonthDisplay))
   .Read(read => read.Action("AllData", "Common"))
 )

The grouping is working properly. But my problem is the group heading is not formatting in MMMM yyyy format. It is showing as Month: 2020-03-02T00:00:00. I need to display header as Month: March 2020

Solution

  • I found the solution for this. I added a GroupHeaderTemplate as given below:

    .columns.Bound(z => z.MonthDisplay).Title("").Hidden(true).ClientGroupHeaderTemplate("#= kendo.toString(kendo.parseDate(value.split('T')[0]), 'MMMM yyyy') #");