jQuery.datepicker.formatDate and timezone offset

javascript jquery-ui timezone-offset
TiTi picture TiTi · Oct 13, 2011 · Viewed 22.2k times · Source

To handle dates, i'm using a jQuery UI public method in my application: jQuery.datepicker.formatDate See params & source here : https://github.com/jquery/jquery-ui/blob/master/ui/jquery.ui.datepicker.js

However the wrong date is displayed sometimes, according to the computer timezone.

Demo here : http://jsfiddle.net/7ACdB/

With a UTC+1 (paris) timezone in windows, i got :

03/30/20
03/30/20

With a UTC-6 (us&canada) timezone in windows, i got :

03/29/20 <- meh!
03/30/20

You need to restart your browser (well for google chrome at least) when you change the OS timezone.

My problem is the "03/29/20" date as you can imagine.

Can somebody explains to me if this is normal or a jquery ui issue ?

I'm beginning to think that it is normal to see a "Mon Mar 30 2020 00:00:00 GMT+0200 (Romance Daylight Time)" as 03/29/20 in a US timezone but i'm not so sure. :-/

Answer

jk. picture jk. · Oct 13, 2011

What you're getting is correct. Your example sets the time at midnight for Paris. Midnight in Paris is 6PM the day before in the US for the Eastern Time Zone which I am in.

Your first time: GMT+0200 is Paris

Your second time: GMT-0500 is Chicago (note it is currently Daylight Savings Time)

So, when you change the time zone to US (using one of our 6 time zones), the output is the time in the US when is that time in Paris.

Here is an updated fiddle with a the time set to 6 AM Paris: http://jsfiddle.net/jensbits/7ACdB/1/

Related questions

jQuery UI DatePicker to show month year only

I am using jQuery date picker to display the calendar all over my app. I want to know if I can use it to display the month and year (May 2010) and not the calendar?

Read More
Calling a function on bootstrap modal open

I used to use JQuery UI's dialog, and it had the open option, where you can specify some Javascript code to execute once the dialog is opened. I would have used that option to select the text within the dialog …

Read More
How to change date format (MM/DD/YY) to (YYYY-MM-DD) in date picker

I have following datepicker script: <script> $(function(){ $("#to").datepicker(); $("#from").datepicker().bind("change",function(){ var minValue = $(this).val(); minValue = $.datepicker.parseDate("mm/dd/yy", minValue); minValue.setDate(minValue.getDate()+1); $("#to").datepicker( "option", "minDate", minValue ); }) }); </script> Now …

Read More