How can I convert a date value in UTC format to a date object in Javascript?

Question

I've been trying to convert a UTC value in a string into a more readable format. To do that, I'm trying to parse the date using the Javascript Date.parse method. That however does not work on the input (eg:"2007-09-21T14:15:34.058-07:00") that i have. The end goal is to output a date string like "January 30th, 2008 @ 2:15PM".

Any ideas?

Answer 1

Try http://www.datejs.com/. It is a JavaScript Date Library with an extended Date.parse method and a Date.parseExact method, which lets you specify a format string. See DateJS APIDocumentation.

Answer 2

You should probably use the datejs that f3lix recommended, however I was bored and threw together a little object that does exactly what you asked for:

var ISODate = {
    convert : function (input){
     if (!(typeof input === "string")) throw "ISODate, convert: input must be a string";
     var d = input.match(/^(\d{4})-(\d{2})-(\d{2})[T ](\d{2}):(\d{2}):(\d{2}(?:\.\d+)?)(Z|(([+-])(\d{2}):(\d{2})))$/i);
     if (!d) throw "ISODate, convert: Illegal format";
     return new Date(
      Date.UTC(d[1],d[2]-1,d[3],d[4],d[5],d[6]|0,(d[6]*1000-((d[6]|0)*1000))|0,d[7]) +
      (d[7].toUpperCase() ==="Z" ? 0 : (d[10]*3600 + d[11]*60) * (d[9]==="-" ? 1000 : -1000))
     );
    },
    format : function(t,utc){
     if (typeof t === "string") t = this.convert(t);
     if (!(t instanceof Date)) throw "ISODate, format: t is not a date object";
     t = utc ?
      [t.getUTCFullYear(),t.getUTCMonth(),t.getUTCDate(),t.getUTCHours(),t.getUTCMinutes(),t.getUTCSeconds()] :
      [t.getFullYear(),t.getMonth(),t.getDate(),t.getHours(),t.getMinutes(),t.getSeconds()];

     return this.month[t[1]] + " " +this.ordinal(t[2]) + ", " +t[0] +
      " @ " + this.clock12(t[3],t[4]);
    },
    month:["January","February","March","April","May","June","July","September","October","November","December"],
    ordinal:function(n) {
     return n+(["th","st","nd","rd"][(( n % 100 / 10) | 0) ===1 ? 0 : n % 10 < 4 ? n % 10 : 0 ]);
    },
    clock12:function(h24,m,s){
     h24%=24;
     var h12 = h24 % 12;
     if (h12===0) h12=12;
     return h12 + ":" +
      (m<10 ? "0" + m : m) +
      (isFinite(s) ? ":" + (s<10?"0"+s:s): "") +
      (h24<12 ? "AM":"PM");
    }
};

Example:

//Shows the date in the users timezone:
alert(ISODate.format("2007-09-21T14:15:34.058-07:00"));

//Show the date in UTC (Timezone Z, 00:00)
alert(ISODate.format("2007-09-21T14:15:34.058-07:00",true));

Explanation:

convert takes a string as an input and returns a date object if successful or throws an exception if not. The string must be in one of the following formats:

• YYYY-MM-DDThh:mm:ss.sZ
• YYYY-MM-DDThh:mm:ss.sXaa:bb

Where:

 - YYYY is the year as an 4 digit integer
 - MM is the month as an 2 digit integer
 - DD is the date of month as an 2 digit integer
 - T is the character T or space (\x20)
 - hh is the hour in 24 hour format, as an 2 digit integer
 - mm is the minute as an 2 digit integer
 - ss.s is the second, either as an 2 digit integer or as a floating point with 2 digits followed by a period followed by one or more digits.
 - Z is the character Z (indicating timezone Z, UTC+00:00)
 - X is either a plus (+) or minus (-) sign of the timeoffset to UTC
 - aa is the hour of timeoffset to UTC as a 2 digit integer
 - bb is the minute of timeoffset to ITC as a 2 digit integer

format takes a string in the above format or a date-object and returns a string formated as:

• M D, Y @ h:mm

Where - M is the full English name of the month - D is the date of month with a numerical order suffix (1-2 digits) - Y is the year (1 or more digits) - h is the hour in 12 hour format (1-2 digits) - m is the minute (2 digits)

month is an array with the name of the months

ordinal is a function that takes a number as input and return the number with English ordinal suffix.

clock12 is a function that takes hour, minute and second in 24h format and converts it to a string in the US 12h format. The seconds is optional.