Parsing JSON data including date creates wrong Date object.

Question

I make an ajax call with jQuery 1.4.2 with dataType: 'json'.

          $.ajax({
          url: url_with_json_formated_response,
          data: jsonOptions, 
          dataType: 'json',
          error: function(XMLHttpRequest, textStatus, errorThrown){
            alert('unable to get data, error:' + textStatus);
          },
          success: function(data) {
             console.log(data);

          });

If I look at the xhr response I get the following.

{"events":[{"start":"2010-10-25T10:00:00-07:00","label_color":"","kind":"availability","end":"2010-10-25T20:00:00-07:00","recurrence":"monday","body":"some body text","title":"some title text","id":"1492"}]}

BUT, the json object that jquery formats for me (console.log(data),has wrong date objects that are close to the year 1970, like Thu Jan 01 1970 23:00:00 GMT+0200 (EET) (pasted form chrome's console)

I suppose there is something wrong with the jSON parsing that create Date objects for me. Any clue?

Answer 1

When I try to create a date with the value 2010-10-25T10:00:00-07:00 I get an "Invalid Date" error. This is a malformed date string.

The year in 1970 is a giveaway that the parser isn't working correctly.

Maybe you could try returning something like 2010-10-25T10:00:00 GMT-0700

Answer 2

Also got this bug(

Now i save date as a miliseconds, and when parsing them back - convert it to date.

Answer 3

Your dates are in ISO-8601 format. Unfortunately, not all browsers' JavaScript engines, including Chrome, support this format. See this question for some details:

http://stackoverflow.com/questions/2479714/does-javascript-ecmascript3-support-iso8601-date-parsing

You'll need to parse the value using JavaScript, I've included an example using the code found behind this link below using your data:

var json = {"events":[{"start":"2010-10-25T10:00:00-07:00","label_color":"","kind":"availability","end":"2010-10-25T20:00:00-07:00","recurrence":"monday","body":"some body text","title":"some title text","id":"1492"}]};

Date.prototype.setISO8601 = function (string) {
    var regexp = "([0-9]{4})(-([0-9]{2})(-([0-9]{2})" +
        "(T([0-9]{2}):([0-9]{2})(:([0-9]{2})(\.([0-9]+))?)?" +
        "(Z|(([-+])([0-9]{2}):([0-9]{2})))?)?)?)?";
    var d = string.match(new RegExp(regexp));

    var offset = 0;
    var date = new Date(d[1], 0, 1);

    if (d[3]) { date.setMonth(d[3] - 1); }
    if (d[5]) { date.setDate(d[5]); }
    if (d[7]) { date.setHours(d[7]); }
    if (d[8]) { date.setMinutes(d[8]); }
    if (d[10]) { date.setSeconds(d[10]); }
    if (d[12]) { date.setMilliseconds(Number("0." + d[12]) * 1000); }
    if (d[14]) {
        offset = (Number(d[16]) * 60) + Number(d[17]);
        offset *= ((d[15] == '-') ? 1 : -1);
    }

    offset -= date.getTimezoneOffset();
    time = (Number(date) + (offset * 60 * 1000));
    this.setTime(Number(time));
}

var start = new Date();
start.setISO8601('2010-10-25T10:00:00-07:00');

alert(start);