ExtJS Date Field does not retain time zone information on submit

Question

I have 3 date fields on a form view. The code on server side looks like this:

DateTime dtUTC = new DateTime(2010,8,8,2,4,6).SetKind(DateTimeKind.Utc);
DateTime dtLocal = new DateTime(2010,8,8,2,4,6).SetKind(DateTimeKind.Local);
DateTime dtUnspec = new DateTime(2010,8,8,2,4,6).SetKind(DateTimeKind.Unspecified);

One is in UTC,one in Local and and one is Unspecified. I am using JSON.NET to serialize the dates in ISO 8601 format. They get serialized correctly to client side and look as follows:

"UtcDate": "2010-08-08T02:04:06.0000000Z",
"LocalDate": "2010-08-08T02:04:06.0000000+05:30",
"TokyoDate": "2010-08-08T02:04:06.0000000"

Now I have 3 ExtJs(Version 6.0.1.250) date fields(I have set the 'displayFormat' to "yyyy'-'MM'-'dd HH':'mm':'ss" to display time as well) which displays them in the browser specific timezone format which is fine.

UTC Date: 2010-08-08 02:04:06
Local Date: 2010-08-08 07:34:06
Unspecified Date: 2010-08-08 02:04:06

My model fields are defined like this

{
    name: "UtcDate",
    type: "date",
    allowNull: true,
    dateFormat: "c"
},
{
    name: "LocalDate",
    type: "date",
    allowNull: true,
    dateFormat: "c"
},
{
    name: "UnspecDate",
    type: "date",
    allowNull: true,
    dateFormat: "c"
}

The problem is when I submit the date to server, I get the dates all in local time zone format

"UtcDate":"2010-08-08T07:34:06+05:30",
"LocalDate":"2010-08-08T02:04:06+05:30",
"UnspecDate":"2010-08-08T02:04:06+05:30"

Is there a way, I can get them back in the same time zone format as the server sent to client? Why does date field does not retain the original record time zone information while submitting?

score 1 · Answer 1 · edited May 23 '17 at 12:22

The date string, when parsed into a javascript Date object, does not retain the original time zone information because javascript Date object does not have time zone information, so the conversion to standard javascript Dates can't be lossless.

Also, basically, the three "time zones" (DateTimeKind) .NET provides are a joke - there are around 100 distinct time zones in use right now, and even more if you account for history. You can see that they are a joke when you compare your TokyoDate with your UTCDate - they are the same, but they shouldn't. An Unspecified time zone doesn't help anyone, since you can deduce a specific point in time from that.

If you need to retain full time zone information with the Date in javascript, you will have to either use a library that supports time zones, like MomentJS, and also a server-side language that supports all time zones with the date object as well, or you will have to build something completely by yourself.

Unfortunately, there is no interworking between MomentJS and ExtJS at the moment, so this also means that you will have to build something yourself, compare How could we set globally in Sencha ExtJS version 6.0.2 the timezone that we want to use?, How to show Moment JS formatted date in ExtJS field with xtype: 'datefield', Convert string to new Date object in UTC timeZONE.

score 0 · Answer 2 · answered Jul 22 '16 at 14:15

To handle it in better way, return date in String format from server side with appropriate timezone conversion. In the convert() function of your model, grab the string and return the date value. This will take care of your timezone issues.

Example:

convert(v){
//Here v is the input string coming from server side.
var date = new Date(v);
return date;
}

Hope this helps !!!

ExtJS Date Field does not retain time zone information on submit

2 Answers2