Question

When a user clicks on a day slot in a month view in the Fullcalendar dayClick event I’d like to have an alert saying that this particular date is not available, for example, a Labor Day holiday.

I wrote this code, but it’s not working, I need that somebody please help me to understand what is wrong here:

    dayClick: function (date, allDay, jsEvent, view) {   
    var myDate=new Date();
    myDate.setFullYear(2012,09,02);

    if (date == myDate){
        alert('Labor Day Weekend. No reservations available'); 
        $(this).css('background-color', 'red');
        return false;

Also, the ‘red’ slot works for this ‘blocked’ day, but then when I click on another day on a calendar, it also turns red. What is wrong here? Please help!
Thank you very much for your help!

Answer 1

A couple of things:

1. Month in date is 0-based. Which means myDate.setFullYear(2012,09,02) is setting the date to Oct 02 2012. I think you were trying to set it to Sep 02 – in which case you need to use myDate.setFullYear(2012,08,02).
2. When you do new Date() it creates a date with the current date and time. And when you do date.setFullYear() it only overwrites the date – not the time. This might cause issues with comparisons. I have always used new Date(2012, 9, 2, 0, 0, 0, 0) to simply this.
3. Finally, I think this is what is causing the issue on your end, the == operator doesn’t work for dates. You will need to explicitly use a valueOf function to compare – like getTime(). Refer to this answer for more details.

I summed all these in a fiddle for you – http://jsfiddle.net/100thGear/sStbC/

Let me know if this helps!