CODEWITHSUNDEEP
javascriptdatedatetimeutc
bradley
bradley

Reputation: 455

JavaScript displaying correct date from dates stored as UTC on server

I have dates stored in my database in UTC format and calling 

element.createdDate = new Date(element.createdDate.toString());

results in displaying the wrong date.

calling

element.createdDate = new Date(element.createdDate.toUTCString());

returns nothing. How do I go about displaying the correct time from UTC?

enter image description here

Upvotes: 0

Views: 713

Answers (2)

RobG
RobG

Reputation: 147523

I have dates stored in my database in UTC format and calling

element.createdDate = new Date(element.createdDate.toString());

results in displaying the wrong date.

2016-10-11T00:00:00Z and Mon Oct 10 2016 20:00:00 GMT-04:00 (EDT) are exactly the same moment in time. The only difference is that one is displayed in ISO 8601 extended format with timezone offset 00:00 and the other is displayed in an RFC 2822 (like) format with timezone offset -04:00 (and assumes a locality in the EDT region).

calling

element.createdDate = new Date(element.createdDate.toUTCString());

returns nothing.

That is unusual. Typically it would return either a string or an error, but without a working example or any code to provide context it's impossible to say why.

How do I go about displaying the correct time from UTC?

You haven't specified what "correct" is. You are displaying a date and time for the same moment in time, just in a different format and time zone.

Upvotes: 0

Matt Johnson-Pint
Matt Johnson-Pint

Reputation: 241920

It appears that your json response contains a string valued which are in ISO8601 format in UTC, and then you are creating Date objects from them.

This part of your code is fine:

if (element.createdDate) element.createdDate = new Date(element.createdDate.toString());
  • You parse the string, and the resulting Date object is correct.
  • However, you don't need to use .toString() here, as the value is already a string. That is redundant.

This part of your code is the problem:

console.log("javascript date: " + new Date(element.depositDate.getUTCDate().toString()));
  • The getUTCDate function returns just the date of the month. Don't use that.
  • No matter what you do to create the Date object, ultimately you create a Date object and you're relying upon an implicit string conversion to output it. This will have different behavior in different browsers.

Consider console.log(new Date()):

  • In Chrome, this logs something like Fri Mar 17 2017 12:14:29 GMT-0700 (Pacific Daylight Time) on my computer. This is as if I called console.log(new Date().toString()); It is in an RFC 2822 like format (but not quite), and is represented in local time.

  • In Firefox, this logs something like 2017-03-17T19:14:46.535Z. This is as if I called console.log(new Date().toISOString()); It is in ISO8601 format, and is represented in UTC.

The point is, don't rely on implicit undefined behavior. If you must work with Date objects, then you should use console.log(element.createdDate.toISOString()) to see the ISO8601 representation of the UTC time.

If you're going to be doing a lot of things with dates and times, you may prefer to use a library, such as Moment.js, which can make tasks such as this more clear.

Upvotes: 1

Related Questions