在全日历中禁用特定日期

Question

I am using full calender as a calender datepicker, and I am facing a problem. I want to disable some dates from clicking (dates in red colour).

Here is my code:

$(document).ready(function() {
  $('#calendar').fullCalendar({
    defaultDate: '<?php echo $today; ?>',
    selectable: true,
    dayClick: function(date, jsEvent, view) {
      $('input[type="text"]').val(date.format());
      //alert('Date:' + date.format());
    },
    editable: true,
    height: 400,
    eventLimit: true,
    events: [
      <?php foreach($lead as $l){?>
      {
        title: '<?php echo $l['ids']; ?>',
        start: '<?php echo $l['followup_date']; ?>',
        <?php if($l['ids'] >= $followuplimit) {?>
          backgroundColor    : '#FF0000',
          borderColor    : '#FF0000'
        <?php } else { ?>
          backgroundColor    : '#008C1F',
          borderColor    : '#008C1F'
        <?php } ?>
      },
      <?php } ?>
    ]
  });
});

Answer 1

You can disable date by adding disabled class to that cell.

Logic : Just have array of dates you want to disable and check if date variable is present in your date arra and if true add disable class.

$('#calendar').fullCalendar({
    ...
    dayRender: function(date, cell){
        if (date > maxDate){
            $(cell).addClass('disabled');
        }
    }
    ...
});