2

I've got a form where I input an event that starts at a certain time. Let's say 9am.

To assign a date/time object I'm using MomentJs. The issue comes when displaying it in different time-zones.

In London will show up 9am as intended - in Kiev will show 11am.

How can I make MomentJS and the browser ignore which timezone is relevant for the user, and just displaying the time I'm giving?

Here's my code:

<p>
Start time:
{moment(event.startDate).format("HH:mm")} 
</p>
iLuvLogix
  • 4,832
  • 2
  • 24
  • 42
SixtyEight
  • 1,594
  • 2
  • 10
  • 21
  • Sorry, what do you mean by "the time you are giving"? Are you referring to your own local timezone? – wentjun Apr 24 '19 at 14:07
  • 1
    `moment.tz('Europe/London').format("HH:mm")` https://momentjs.com/timezone/ – Keith Apr 24 '19 at 14:08
  • I just elaboratly answered a similar question - have a look [here](https://stackoverflow.com/questions/55829344/getting-wrong-timestamp-from-date-in-different-timezone-using-moment/55829890#55829890) – iLuvLogix Apr 24 '19 at 14:13
  • 1
    Possible duplicate of [moment.js - UTC gives wrong date](https://stackoverflow.com/questions/17855842/moment-js-utc-gives-wrong-date) – Heretic Monkey Apr 24 '19 at 14:18

3 Answers3

2

Assuming you have stored the date as utc (which in this case you probably should have), you could use the following:

moment.utc(event.startDate).format("HH:mm")
Will Taylor
  • 1,470
  • 6
  • 22
1

Let me provide an alternative answer in Vanilla JavaScript. If you want to make it timezone 'neutral', you can first convert it to UTC using toISOString().

const current = new Date();
const utcCurrent = current.toISOString();

console.log(utcCurrent);

If you want to convert it to a specific timezone, such as London, you can use toLocaleString(). Do take note of the browser support for the timezone though.

const londonTime = new Date().toLocaleString('en-US', { timeZone: 'Europe/London' })
console.log(londonTime);
wentjun
  • 35,261
  • 9
  • 79
  • 93
1

What you want is a normalized Datetime. This can get a little confusing since the concept of timezones is a rather arbitrary construct.

I like to think of Datetime values as "absolute" and "relative". An "absolute" Datetime is one that is true regardless of which timezone you're in. The most common example of these are UTC(+000) and UNIX Time (also known as Unix epoch, POSIX Time or Unix Timestampe).

UTC is pretty obvious. Its the current time at +000 timezone. UNIX time is a bit more interesting. It represents the number of seconds that have elapsed since January 1, 1970.

You should always store data, in both client and backend, as an "absolute" time. My preference is UNIX time since its represented as a single integer (nice and clean).

moment.js does this for you. When you instantiate your moment object, you can use:

var date = moment.utc(utcString)

or for Unix Time

var date = moment.unix(unixInt)

You can then use this object to display the date in any form you wish:

console.log(date.tz.("America/Toronto"))

jmkmay
  • 1,303
  • 6
  • 20