Nan issue in IE 11

Question

I have the following javascript -

datefrom = new Date(event.min);

                           if (datefrom != 'Invalid Date') {

                               var day = datefrom.getDate();
                               var month = datefrom.getMonth() + 1; //Months are zero based
                               var year = datefrom.getFullYear();
                               var hour = datefrom.getHours();
                               var min = datefrom.getMinutes();

                               if (day < 10)
                                   day = "0" + day;
                               if (month < 10)
                                   month = "0" + month;
                               if (hour < 10)
                                   hour = "0" + hour;
                               if (min < 10)
                                   min = "0" + min;

                               datefrom = day + "/" + month + "/" + year + " " + hour + ":" + min;


                               $("#DateBox1").val(datefrom);
                           }
                           else {
                               alert('IM HERE!!!');
                               $("#DateBox2").val(originalFrom);
                           }

When using the application in Chrome and FireFox I can successfully get into the else statement and alert "!M HERE!!!" no bother, as datefrom is an invalid date.

However IE states that date from is NaN and for some reason I can't get into the else statement.

I have put alrets within the if statement to see where I am when running and for some reason I just can't get into the else and set the correct value in IE. Why is this happening???

Answer 1

It would help to know what the input value is, but in general you need to be aware that there are a number of known cross-browser quirks when working with the built-in Date object. A string that is successfully parsed as a date in one browser may not be seen as valid in another.

Secondly, testing for "Invalid Date" is probably not the best way to determine whether the date is valid. I would suggest that if(isNaN(datefrom.getDate())) is probably going to be a better test.

Finally, if you're parsing date strings, you might want to consider using one of the third-party libraries that are available for making dates easier to work with in JS. Look up either Date.js or Moment.js. These libraries will give you better cross-browser compatibility, and also additional features that aren't in the standard Date object.

Answer 2

Use the below line to check the valid date instead of datefrom != 'Invalid Date'

if(datefrom.getTime === "function" && isFinite(datefrom.getTime()))

Answer 3

You haven't stated what event.min is, so we are left to speculate on what might be causing the error.

The Date constructor will return either a Date object or NaN, so the test datefrom != 'Invalid Date' should always be true as new Date(...) will never return the string 'Invalid Date' where the implementation complies with any version of ECMAScript.

If the result is NaN, it means that the constructor was unable to create a valid date object from whatever was passed to it according to the rules in ECMA-262, which might mean that it's a value that, when converted to a primitive:

1. Is a string that, when parsed, does not result in a valid date
2. Is a number that is greater than 8.64e15 and so exceeds the allowed value for a time clip

In the first case, there are many strings that can be successfully parsed by some implementations but not by others. There are also strings that can be successfully parsed (i.e. result in a Date object) by two implementations but result in different dates, e.g. 2014-03-24T20:20:00 will be treated (correctly) by Chrome as UTC but (incorrectly) as local by Firefox.