Date comparison in Client Side considering Timezone - Javascript/Jquery

Question

I have a requirement there i need to compare the date with local time. I am setting a Date in DatetimePicker which is in EST DateTime. So i need to compare it with current time and if it is less than current time, I need to show validation alert. Current time in user machine will be of different timezones. So I always need to convert current time zone to to EST time zone before comparing. If current Timezone in user machine in EST,then need to consider the same value and conversion is not required.How can I achieve this in Javascript/Jquery.How can I modify below javascript to handle above case.

iam setting START_DATE n cshtml page as follows

  <div class='input-group date' id='datetimepicker1'>
                                @Html.EditorFor(model => model.START_DATE, new { htmlAttributes = new { @class = "form-control z-index-0" } })
                                <span class="input-group-addon" id="calenderStart">
                                    <span class="glyphicon glyphicon-calendar"></span>
                                </span>
                            </div>

In Javascript side...

var startDate= new Date($("#START_DATE").val());
var currentDateTime= new Date();  //Convert to EST if it is in DifferentTimeZone.Doubt on this part
if(startDate < currentDateTime)
{
 alert ("StartDateTime should be greater than current EST DateTime);
}

Answer 1

Perhaps the most easy to understand approach is to convert both datetimes to UTC and then compare them.

To convert your datepicker time to UTC, you can just add 5 hours, since EST is always 5 hours behind UTC.

var theDateAsString = "07/15/2021 12:08 PM";
var dateFromDatePicker = new Date(theDateAsString);
dateFromDatePicker.setHours(dateFromDatePicker.getHours() + 5);
console.log(dateFromDatePicker);

Independent of your location, the console will give you the EST time plus 5 hours. The console will print the UTC date with the timezone offset, so for example if you are in Central European Summer Time zone (2 hours later than UTC), it prints the following:

Date Thu Jul 15 2021 17:08:00 GMT+0200 (Central European Summer Time)

So now you also need to convert the user's time to UTC in order to be able to compare. You can easily do this by using getTimezoneOffset() . This will return the user's timezone offset in minutes, so we can add these minutes to the user's date.

var usersDate = new Date();
console.log(usersDate); //e.g. Date Fri Jul 09 2021 12:44:39 GMT+0200 (Central European Summer Time)
console.log(usersDate.getTimezoneOffset());// e.g. -120 === -2 hours
usersDate.setMinutes(usersDate.getMinutes() + usersDate.getTimezoneOffset());
console.log(usersDate); // e.g. Date Fri Jul 09 2021 10:44:39 GMT+0200 (Central European Summer Time)

Now you can just compare the dates:

if(usersDate < dateFromDatePicker){
    alert("earlier");
}
else{
    alert("later or the same");
}

To show that this works, assume the user is in Central European Summer Time (UTC + 2 hours) and the datetime is 13:00 on the 9th of July. This will print "user's date is earlier", since the difference between the time zones is 7 hours (07:00 + 7 = 14:00):

var theDateAsString = "07/09/2021 07:00 AM";
var dateFromDatePicker = new Date(theDateAsString);
dateFromDatePicker.setHours(dateFromDatePicker.getHours() + 5);
console.log(dateFromDatePicker);
var usersDate = new Date();
usersDate.setMinutes(usersDate.getMinutes() + usersDate.getTimezoneOffset());
console.log(usersDate);
if(usersDate < dateFromDatePicker){
    console.log("user's date is earlier");
}
else{
    console.log("user's date is later or the same");
}

This will print "user's date is later or the same" (05:00 + 7 hours = 12:00):

var theDateAsString = "07/09/2021 05:00 AM";
var dateFromDatePicker = new Date(theDateAsString);
dateFromDatePicker.setHours(dateFromDatePicker.getHours() + 5);
console.log(dateFromDatePicker);
var usersDate = new Date();
usersDate.setMinutes(usersDate.getMinutes() + usersDate.getTimezoneOffset());
console.log(usersDate);
if(usersDate < dateFromDatePicker){
    console.log("user's date is earlier");
}
else{
    console.log("user's date is later or the same");
}

Answer 2

In JavaScript, you can use toLocaleString and provide time zone code to convert.

var d = new Date();
d.toLocaleString('en-GB', { timeZone: 'UTC' })
console.log(d);

More example can be found on this URL.
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleString