Grouping with date format

[Mehvish Fatma]

Hi.

I am using the grouping feature in the grid. However, the grouping does not seem to work with dates when the type has been set to date, and a date format has been specified.

Please find a sample below. On grouping the column 'Active', you may see a console error 'e.getdate is not a function'.

Please let me know when this bug can be fixed at the earliest.

Stackblitz: https://stackblitz.com/edit/angular-zff2wm?file=app.component.html

Regards,
Mehvish

 

[Thiyagu Subramani]

Hi Mehvish, 

Thanks for contacting Syncfusion support. 

Query: TypeError: e.getDate is not a function. 

 

The mentioned script error has been thrown due to that you are using a string value in the data source for the date column (Active). If we define column.type as the date in the column definition, then it will automatically convert the date string into a date object and the Grid is displayed the date value with your given format. 

To resolve the mentioned issue we suggest you to convert the date string value into date object using the filter method of JavaScript. Using load event we have converted the Active column values into date objects to avoid the script error.  

Please refer to the below code example and sample for more information. 

 

function load() { 

    (this.grid.dataSource as any).filter(data => { 

      if (data.Active && typeof data.Active === "string") { 

        data.Active = new Date(data.Active); 

      } 

    }); 

} 

Date Formats:  https://ej2.syncfusion.com/documentation/grid/columns/#date-formatting 

For more reference, please refer to the modified sample. 

Sample link: https://stackblitz.com/edit/angular-zff2wm-phyech?file=app.component.ts 

Note: If we use date string as like T00:00:00.000Z , it is a part of ISO-8601 date representation. So for this case if you set type as datetime in column level then it will be converted into the date object in source level.  By default in EJ2 Grid the date column will be filter and sort properly when the values in date object. 

Please get back to us if you need further assistance with this. 

Regards, 

Thiyagu S 

[Mehvish Fatma]

Hi Thiyagu,

Thank you for your prompt reply. The solution worked for me!


Thanks a lot

[Thiyagu Subramani]

Hi Mehvish, 

Thanks for your update. 

We are happy to hear that the provided solution works at your end. 

Please get back to us, if you need any further assistance. 

Regards, 

Thiyagu S