How can I convert string formatted UTC dates without offset to local time in JavaScript?

Question

I am getting a string formatted date with UTC timezone. I need to convert this date time in user's current time zone using jquery or javascript.

I am getting this:

9:43pm 16/10/2015 //this is UTC time, I am getting this via an ajax call

I need to convert it to this:

12:00pm 16/10/2015 //whatever time by that location

• Carlo G.: do you can use moment.js?
• charlietfl: is that the actual format sent? Do you control the api source?
• Anshul Mishra: @charlietfl yes this is the actual time format sent from php
• Anshul Mishra: @CarloG. I do not have knowledge of moment.js, it will be good if I can get this by jquery or javascript
• charlietfl: will need to parse that string to create a Date object or change format sent to avoid parsing and just pass to new Date()

Answer 1

If you can pick that format apart, or get a standard format JavaScript can parse - you can convert it to a Date object. I'm not seeing an offset on that date which is problematic when JavaScript tries to parse it. Assuming that is all you have, we can force a UTC date with the following...

// ------- new Date(Date.UTC(year, month, day, hour, minute, second))
var date = new Date(Date.UTC(2015, 9, 16, 21, 43, 0));
console.log(date) // Fri Oct 16 2015 15:43:00 GMT-0600 (Mountain Daylight Time (Mexico))

• note that month in Date.UTC is zero based e.g. October would be 9

new Date(value) would do this for us automatically if the format is correct - where value is the actual date value you receive - but that format will not parse as is. If there is no way around that format, you can manipulate it to work in the above example. Here is an untested algorithm for your example...

var formatted = '9:43pm 16/10/2015'
function createDateUTC(formatted) {
 var hourOffset = formatted.split(' ')[0].split(':')[1].match(/[a-zA-Z]+/g)[0] === 'pm' ? 12 : 0
 var year = parseInt(formatted.split('/').pop());
 var month = parseInt(formatted.split('/')[1]) - 1;
 var day = parseInt(formatted.split('/')[0].split(' ').pop());
 var hour = hourOffset + parseInt(formatted.split(' ')[0].split(':')[0]);
 var minute = parseInt(formatted.split(' ')[0].split(':')[1]);
 return new Date(Date.UTC(year, month, day, hour, minute, 0));
}
var myDate = createDateUTC(formatted);

JSFiddle Link - working demo

Check out the UTC() and Date Object docs for more info

---

Additionally, to get the exact format you want, we can introduce some more functions which will give us the 12:00pm 16/10/2015 format

function formatAMPM(date) {
 var hours = date.getHours();
 var minutes = date.getMinutes();
 var ampm = hours >= 12 ? 'pm' : 'am';
 hours = hours % 12;
 hours = hours ? hours : 12; // the hour '0' should be '12'
 minutes = minutes < 10 ? '0'+minutes : minutes;
 var strTime = hours + ':' + minutes + '' + ampm;
 return strTime;
}
function formatMMDDYYYY(inputFormat) {
 function pad(s) { return (s < 10) ? '0' + s : s; }
 var d = new Date(inputFormat);
 return [pad(d.getDate()), pad(d.getMonth()+1), d.getFullYear()].join('/');
}
console.log(formatAMPM(myDate) + ' ' + formatMMDDYYYY(myDate));
// Mountain Daylight Time => -- 3:43pm 16/10/2015

JSFiddle Link - formatted example

I'd reccoment looking into Moment.js if you plan to do heavy date formatting and manipulation.

---

Overall - the best solution to this would be to return an acceptable format from the server, resolve it to local time natively e.g. new Date(), and use a robust formatting library as opposed to rolling your own to display it how you wish.

• Anshul Mishra: thanks for the solution, I am bit confuse on one thing. Actually I am getting date time in south Australia Time Zone and I need to convert this in the user's current location's Time Zone. Here I did not understand that where we are converting the Time Zone in user's time zone.
• Anshul Mishra: Okay I think I was not get the code, now I have understand where it is converting to my Time Zone, but where we are passing that, the given date time is in South Australia Time Zone. For example If I will convert South Australia Time (11:30 17/10/2015) to UTC then it will return different time and if I will convert Asia/Kolkata Time (11:30 17/10/2015) to UTC then it will return different time. So I think we also need to pass the time zone of given time some where.
• scniro: those both seem to be the same time. Doesn't matter the name of it, my example says Mexico but I am in USA - but the time is correct. It's driven by the system clock of the OS. I guess I'm really confused with your response - why exactly is this not working for you?
• Anshul Mishra: that was not exactly what I want, I think I did not ask question properly :( , but no issue your code helps me a lot, I have used a part of your code for my solution and I have understand that how it works and how to play with time in javascript. So thanks a lot for your answer :)

Answer 2

You should process that string a little bit to extract year, month, day, hour and minute.

Then you can create a local date with that UTC date using this:

var time = new Date ( Date.UTC('year', 'month', 'day', 'hour', 'minute') );

In my case, '9:43pm 16/10/2015' returns: 'Mon Nov 16 2015 07:43:00 GMT-0200 (Hora de verano de Argentina)'.

• scniro: how is this any different from the answer I posted earlier?
• Aramil Rey: I didn't saw your answer, I was checking the results of this and it took more than the difference of time between our answers. Your answer has a flaw though, you should check if hour is pm or am to add 12 or not. Good luck!
• scniro: I tried to accommodate for the hour offset thanks for pointing that out
• Anshul Mishra: Thanks for the solution. Actually my issue is, I am getting date time of south Australia time zone, and I need to convert this in user's time zone, how can we achieve this.
• Aramil Rey: This code executes on the browser, it should use the time zone of the users clock!