Date object returns NaN when trying to calculate time between two dates in IE8

Question

I have a string which represents the expiry of an item like so: 2020-10-31T21:30:11, and I have a function to calculate the amount of days left until this date (below).

However, in IE8 it doesn't work. I think this is because timeEnd is returning NaN. Can someone explain why this doesn't work and point me in the right direction?

I have a jsFiddle here.

And here's a snippet of my code:

HTML

<span class="days-left" data-publishend="2020-10-31T21:30:11"></span>

JS

$('.days-left').each(function () {

    if ($(this).data("publishend")) {
        var timeEnd = new Date($(this).data("publishend")), // returns NaN in IE8
            timeNow = new Date(),
            oneDay = 24*60*60*1000,
            oneHour = 60*60*1000,
            oneMin = 60*1000,
            daysLeft = Math.floor(Math.abs(timeEnd.getTime() - timeNow.getTime())  / oneDay),
            hoursLeft = Math.floor(Math.abs(timeEnd.getTime() - timeNow.getTime())  / oneHour),
            minsLeft = Math.floor(Math.abs(timeEnd.getTime() - timeNow.getTime())  / oneMin),
            string;

        if (daysLeft < 1) {
            if (hoursLeft < 1.5) {
                string = minsLeft + ' minutes';
            } else {
                string = hoursLeft + ' hours left';
            }
        }
        if (daysLeft === 1) string = '1 day left';
        if (daysLeft > 1) string = daysLeft + ' days left';

        $(this).text(string);
    }
});

IE8 doesn't know how to parse that date string. – thirtydot Oct 25 '13 at 14:44 — thirtydot, Oct 25 '13 at 14:44

score 1 · Answer 1 · edited May 23 '17 at 10:31

1

You are right, IE8 won't parse your date right at the beginning (timeEnd init). Here is the reason : https://stackoverflow.com/a/17593482/2143734 Just one more date handling issue ;)

edited May 23 '17 at 10:31

Community

1
1

answered Oct 25 '13 at 14:43

Zzirconium

431
1
10
32

score 0 · Answer 2 · edited May 23 '17 at 12:21

try this

function parseISO8601(dateStringInRange) {
    var isoExp = /^\s*(\d{4})-(\d\d)-(\d\d)\s*$/,
        date = new Date(NaN), month,
        parts = isoExp.exec(dateStringInRange);

    if(parts) {
      month = +parts[2];
      date.setFullYear(parts[1], month - 1, parts[3]);
      if(month != date.getMonth() + 1) {
        date.setTime(NaN);
      }
    }
    return date;
  }

to make the conversion.

Source: Date constructor returns NaN in IE, but works in Firefox and Chrome

score 0 · Accepted Answer · edited May 23 '17 at 11:57

From looking at answers in this Stackoverflow question, I've got a grasp of what was going on and created my own function that worked the string that I wanted to convert a date object.

IE8 cannot parse the string 2020-10-31T21:30:11 like other browsers can. But the date object can accept comma separated values representing the year, month, day, etc, and use them to create the new instance (more info about the Date object).

So I created a function that takes my string, spits it at the "T" and then splits the remaining values at either the "-" or the ":". The function then returns the a date object instance using these values as the parameters.

function parseDateString(dateString) {
    var a = dateString.split('T'),
        year = a[0].split('-')[0],
        month = a[0].split('-')[1],
        day = a[0].split('-')[2],
        hour = a[1].split(':')[0],
        min = a[1].split(':')[1];

    return new Date(year, month - 1, day, hour, min);
}

Date object returns NaN when trying to calculate time between two dates in IE8

3 Answers3