Comparing dates across timezones using JavaScript: EST vs local time

Other Questions JavaScript
1

Hey everyone, I’m working on a project where I need to compare dates with local time, but it’s a bit tricky. Here’s what I’m trying to do:

I’m using a DatetimePicker to set a date in EST. I want to compare this with the current time, but the user’s machine could be in any timezone. So, I need to convert the current time to EST before comparing. If the user is already in EST, no conversion is needed.

Here’s a simplified version of what I’ve got so far:

let pickedDate = new Date($("#date-picker").val());
let now = new Date();  // Need to convert this to EST if different

if (pickedDate < now) {
  alert("Please pick a future date and time");
}

How can I modify this to handle the timezone conversion correctly? Any tips or tricks would be super helpful! Thanks in advance!

2

hey emma, timezone stuff can be tricky! have u tried using the date-fns library? it’s pretty awesome for handling dates n timezones. u could use their utcToZonedTime function to convert ur dates to EST before comparing. might save u some headaches! good luck with ur project!

3

Having worked on projects with similar timezone challenges, I can share a robust solution using the Moment.js library. It’s quite versatile for handling these scenarios.

First, install Moment.js and the Moment Timezone plugin. Then, you can use it like this:

let pickedDate = moment.tz($("#date-picker").val(), "America/New_York");
let now = moment().tz("America/New_York");

if (pickedDate.isBefore(now)) {
  alert("Please pick a future date and time");
}

This approach automatically handles timezone conversions and DST changes. It’s been reliable in production environments I’ve worked on. Just ensure you keep the library updated for the latest timezone data.

4

I’ve dealt with similar timezone issues in my projects. Here’s what worked for me:

Instead of relying on the local machine’s time, I found it more reliable to use the Intl.DateTimeFormat API. You can create a formatter for EST like this:

const estFormatter = new Intl.DateTimeFormat('en-US', {
  timeZone: 'America/New_York',
  year: 'numeric',
  month: 'numeric',
  day: 'numeric',
  hour: 'numeric',
  minute: 'numeric',
  second: 'numeric'
});

Then, you can use this formatter to convert both your picked date and the current time to EST before comparing:

let pickedDate = new Date($("#date-picker").val());
let now = new Date();

let estPickedDate = new Date(estFormatter.format(pickedDate));
let estNow = new Date(estFormatter.format(now));

if (estPickedDate < estNow) {
  alert("Please pick a future date and time");
}

This approach has been pretty solid for me, handling DST changes automatically. Hope it helps!