Question

I found this datepicker events but not working on IE. I don’t know what is wrong with this code.

var Event = function(text, className) {
        this.text = text;
        this.className = className;
    };


var events = {};
events[new Date("18/Jan/2013")] = new Event("Drinks @ Seymours - Alumni Event", "Yes");
events[new Date("16/Jan/2013")] = new Event("Retired Staff Luncheon", "Yes");
events[new Date("13/Jan2013")] = new Event("October Spring Lunch - Alumni Event", "Yes");


$("#dates").datepicker({
    dateFormat: 'dd/M/yy',  
    firstDay: 1,
    showOtherMonths: true,
    onSelect: function(date) {
        $('#CAT_Custom_241423').val(date);
        $('#submit-btn-webapp').trigger('click');
    },
    beforeShowDay: addClass 
});

function addClass(date) { 
    var event=events[date];
    if(event){
        return[true,event.className,event.text];
    }
    else {
        return[true,'',''];
    }
}

It is working fine on ff, Google Chrome.
Here’s the the working code on jsfiddle

http://jsfiddle.net/7U56z/

Answer 1

The problem are the event keys (the generated dates). If you try the following in IE:

 alert(new Date("18/Jan/2013"));

You’ll get an error (invalid date). So you’ll never get a match in your function. Define the keys like this (or simular to this):

 events[(new Date(2013, 0, 18, 0, 0, 0))] = new Event(....)
 // format in this case is:
 // new Date(year,month,day,hour,minute,second)
 // month starts with 0.

and it works. You don’t have to set hour, minute and second in this case. You just have to be sure that the generated key is a valid date and matches the date coming from the datepicker.

By the way, I would rename your “Event” Object to something different, because there is already an window.event that is a bit confusing.