Kendo UI display UTC to AEST / AEDT

user_10318088 0
Viewed 131

I have a Kendo UI grid that fetches data from API by AJAX call. It has a column with date and the date is coming from backend in this format "2022-03-08T19:02:00".

This is one of the column of my grid where I am parsing the date :

{
                        field: "createdDate",
                        title: "Created Date",
                        template:"<div class='createdDateTemplate'>#= kendo.toString(kendo.parseDate(createdDate)) #</div>",
                        width: 150
                    }

I want to display this date in AEST or AEDT which ever is being followed . Is this possible from the template itself ?

EDIT :

I know that Kendo automatically renders date time in local format something like this for me:

GMT+1000 (Australian Eastern Standard Time)

But is it possible to display this time with +10 added to time itself ?

Edit: I am trying this template:"<div class='createdDateTemplate'>#= kendo.toString(kendo.timezone.convert(kendo.parseDate(createdDate), 'Etc/UTC', 'Etc/GMT+10'), 'dd/MM/yyyy hh:mm tt') #</div>", but I am getting this error: Cannot read properties of null (reading 'getFullYear')

kendo-grid kendo-ui jquery c#
2 Answers

Kendo automatically converts the dates to the user's local time if you add zzz to the end of date , like this yyyy-MM-ddTHH:mm:sszzz. One more thing , you say that your date is UTC but it doesn't have a Z (zero utc offset) at the end. Kendo won't add the offset without it , so I would recommend adding it. Maybe you could try something like this:

#= kendo.toString(kendo.parseDate(modifiedDate+'Z','yyyy-MM-ddTHH:mm:sszzz'), 'dd/MM/yyyy hh:mm tt')#
user_157660930

Yes, you can display the date however you like it. Read the Kendo Date Parsing documentation. I would suggest though that the back-end send it in ISO format (e.g. yyyy-MM-ddTHH:mm:ss). So that on the front-end, you can just do parseDate without the need for additional parameters. Perhaps depending on the language setting of the browser it will be shown in AEST or AEDT format. If not, then you can do toString on the date.

user_57974000
Related