JavaScript new Date() Returning NaN in IE or Invalid Date in Safari

February 8th, 2011 - Posted by Steve Marks to Javascript / jQuery, Web Development.

When it comes to programming, working with dates can be tricky. Luckily however most languages have done the hard work already and come with some kind of built-in date functionality to assist us. JavaScript inparticular has lots of useful functions to aid in getting, setting and outputting dates.

The JavaScript Date Object

To begin working with dates in JavaScript the first thing you need to do is initialise a date object like so:

var d = new Date();

That’s fine if we want get the current date and time, however it doesn’t help us much if we are planning on working with a date in the past or future. In this instance we would need to pass a date as a parameter to the code above.

The Problem

The problem I wanted to discuss today is specific to Internet Explorer and Safari and is about how passing a date as shown below doesn’t work as expected:

var d = new Date("2011-02-07");
alert(d);

Or:

var d = new Date("2011-02-07T11:05:00");
alert(d);

If you were run the above code snippets across various browsers you would see that in IE you get ‘NaN’ returned and in Safari you get ‘Invalid Date’. Firefox, Chrome and Opera however will output the correct date.

The Solution

The problem lies in the format that you pass the required date to the Date() object. For some reason, and don’t ask me why, the two aforementioned browsers surprisingly do not support the date format “yyyy-mm-dd” and therefore fail. I haven’t managed to compile a definitive list of supported date formats, however I can tell you the following formats are definitely supported across all browsers and would advise sticking to one of these to avoid errors:

var d = new Date(2011, 01, 07); // yyyy, mm-1, dd
var d = new Date(2011, 01, 07, 11, 05, 00); // yyyy, mm-1, dd, hh, mm, ss
var d = new Date("02/07/2011"); // "mm/dd/yyyy"
var d = new Date("02/07/2011 11:05:00"); // "mm/dd/yyyy hh:mm:ss"
var d = new Date(1297076700000); // milliseconds
var d = new Date("Mon Feb 07 2011 11:05:00 GMT"); // ""Day Mon dd yyyy hh:mm:ss GMT/UTC
This entry was posted on Tuesday, February 8th, 2011 at 12:33 am by +Steve Marks and is filed under Javascript / jQuery, Web Development. You can follow any responses to this entry through the RSS 2.0 feed.
Comments...

Fear not, we won't publish this

Comments (23)

No comments have been left yet. Be the first