Date column format

[Alexandros Ginakos]

I have been trying to format a date column. Your standard syntax, like "yMd", "d" and "y" are working.

However, when trying to apply a custom format, the grid appears to not show any data, without any errors.

I have tried several approaches like "format='dd/MM/yyyy'" or "format='{0:dd/MM/yyyy}'" and none seem to work.

Is there a syntax I am missing? How can we make this happen?

[Venkatesh Ayothi Raman]

Hi Alexandros, 

Thanks for using Syncfusion products. 

We went through your code example that you have shared for us and found that you are applying a jQuery date formats to EJ2-Grid. But we have used the Unicode CLDR for formatting and parsing date and number objects. Please refer to the following Help documentation for more information, 

https://ej2.syncfusion.com/16.1.24/angular/documentation/base/intl.html#loading-culture-data 

https://ej2.syncfusion.com/16.1.24/angular/documentation/base/intl.html#manipulating-datetime 

Online Reference: http://cldr.unicode.org/translation/date-time-patterns#TOC-Basic-Date-Formats 

So, we can achieved your requirement by using custom format future in the “column.format” property. Please refer the following code example and documentation link.  Please refer to the sample, 

__<ejs-grid [dataSource]='data' height="315px"> 

    <e-columns> 

                 . .   .  

        <e-column field='OrderDate' type='date' headerText='Order Date' textAlign='Right' [format]='formatOptions' width=120></e-column> 

    </e-columns> 

</ejs-grid> 

 

[ts] 

export class AppComponent implements OnInit { 

 

    public data: Object[]; 

    public formatOptions:any; 

    ngOnInit(): void { 

        this.data = data; 

        this.formatOptions={type:'date',format:"dd/MM/yyyy"}; 

    } 

} 

Sample: https://plnkr.co/edit/x1zkLEIcLbSaFY58q6FJ?p=preview 

Help documentation: https://ej2.syncfusion.com/16.1.24/angular/documentation/base/intl.html#custom-formats 

Regards, 

Venkatesh Ayothiraman. 

[Alexandros Ginakos]

Hello Venkatesh,

Works like a charm. Your response was quick and to the point. Thank you.

Regards,

Alex

[Isuriya Rajan]

Hi Alex, 

We are happy to hear your problmes has been resolved. 

  

Regards, 

Isuriya R 

[Jan Poljovka]

Hi Isuriya,

when I format datetime column in angular grid like you proposed in answer to Alexandros with [format]='formatOptions' in html code

and this.formatOptions={type:'date',format:"dd/MM/yyyy"};  in ts code, Export to Excel functionality does not work
(when I click on the export button nothing happens, no error is rendered in browser console)
while export to pdf works normaly.