jquerydatefullcalendarfullcalendar-1

How to make past date unselectable in fullcalendar?


Problem is, how to disable selectable on PAST DATES in fullcalendar's month/week view.

I want to user not allowed to click/select the on past dates.

enter image description here

Here is some googled code snippet I am trying to implement on event rendering:

selectable: true,
selectHelper: false,
select: function(start, end, allDay) {
        var appdate = jQuery.datepicker.formatDate('<?php echo $DPFormat; ?>', new Date(start));
        jQuery('#appdate').val(appdate);
        jQuery('#AppFirstModal').show();
    },
    eventRender: function(event, element, view)
    {
        var view = 'month' ;
       if(event.start.getMonth() !== view.start.getMonth()) { return false; }
    },

But its not working though.

I tried bellow CSS too and this help me to hide past date text only, but selectable is still working on pastdate box.

.fc-other-month .fc-day-number {
     display:none;
}

I am really stuck with this problem. Please someone help me out. Thanks...


Solution

  • I have done this in my fullcalendar and it's working perfectly.

    you can add this code in your select function.

     select: function(start, end, allDay) {
        var check = $.fullCalendar.formatDate(start,'yyyy-MM-dd');
        var today = $.fullCalendar.formatDate(new Date(),'yyyy-MM-dd');
        if(check < today)
        {
            // Previous Day. show message if you want otherwise do nothing.
            // So it will be unselectable
        }
        else
        {
            // Its a right date
            // Do something
        }
      },
    

    I hope it will help you.