jQuery Date Picker - TimeZone Issue

Question

We are using a jQuery date picker on our website to select dates and times for bookings. The calendar is currently set at PST and this causes bugs when users try to access from other timezones. Should we set the server to be UTC and have the application automatically select user's timezone based on their IP Address. I was curious as whether we would also have to include manual selection as automatic selection may fail (i.e. when user works through proxy). Any advice would be greatly appreciated.

Solution 1

The user already selects their timezone which is in their OS settings. Use javascript to detect this timezone (not based on IP), and pass it along with the date picker value to the server-side app. You can convert the local time to UTC time in Javascript or the server-side, whichever you prefer. But keep the server side app in UTC, since it's a good practice and internally that's what some languages uses, for eg., java.util.Date in Java.

Solution 2

I would venture to guess that the front end doesn't need to have ANY understanding of timezones at all.

When they select a time from the datepicker, just pass it back as is (if they selected 9PM, just pass back 9PM). On the server, convert that date & time to a timestamp.

At that point, you can then make adjustments for the user's timezone based on IP, or however you choose to implement that. You can just add or subtract hours from your target time to match the user's timezone.

However, this means that you'll also need to re-parse the times when you output them to make sure that they show up how they should. So if you're storing a Unix timestamp, for example, make sure you print out a formatted date based on the location of the user.

You should definitely allow the user to choose their own timezone to override however you do it by default.

Solution 3

If you only need to display times in the web interface:

• calculate time on the client as seconds (Unix time) using Date.getTime()/1000; respectively Date.setTime(utc_seconds*1000); note that Javascript uses milliseconds
• transmit all times between the client and the server as seconds (Unix time)
• store time as UTC timestamps (chances are that your backend supports conversion to a UTC timestamp)

If you need to do other stuff on the server with human readable time (e.g. send email that includes a meeting time):

• capture the timezone in the client (e.g. using jsTimezoneDetect) and save it on the server
• use the captured time zone for server-side calculations for the user

Warnings:

• no matter what the mechanism, IP-based location detection is imperfect; I wouldn't use it for timezone detection
• most non-Windows systems use the tz database; if your back end is Microsoft, you may need to convert to Windows standard timezones
• while timezone detection is swell, things can go wrong, as some jurisdictions change time zones ad hoc;
• for your application, I predict most pain on time zone rule changes if you support recurring meetings; OS's usually include this in service packs
• you may consider a mechanism for the user to manually set the timezone (possibly after auto-detection)