使用fullcalendar重复发生的事件和非重复事件

时间:2017-10-03 20:12:01

标签: javascript php jquery fullcalendar

events: [

     {
      id: '<?php echo $event['id']; ?>',
      title: '<?php echo $event['title']; ?>',
      color: '<?php echo $event['color']; ?>',
      start: '<?php echo $start; ?>',
      end: '<?php echo $end; ?>',
      dow: '<?php echo $dow; ?>',
      ranges: [{
                 start: '<?php echo $start; ?>', 
                 end: '<?php echo $end; ?>',
               }]
      },
]

下面的图片显示了我日历的当前状态: Calendar

从上图可以看出,有氧训练一直在反复进行。有没有办法根据范围中的结束日期停止重复发生的事件,而不是使用事件呈现功能?

请注意: <?php echo $start; ?><?php echo $end; ?>是以YYYY-MM-DD格式化的日期。

尝试ADyson的解决方案后更新 updatedCalendar

   <?php foreach ($events as $event): ..... ?> 
{
      id: '<?php echo $event['id']; ?>',
      title: '<?php echo $event['title']; ?>',
      color: '<?php echo $event['color']; ?>',
      start: '04:00',
      end: '05:00',
      dow: '<?php echo $dow; ?>',
      ranges: [{
                 start: '<?php echo $start; ?>', 
                 end: '<?php echo $end; ?>',
               }]
}, 
{
      id: '<?php echo $event['id']; ?>',
      title: '<?php echo $event['title']; ?>',
      color: '<?php echo $event['color']; ?>',
      start: '<?php echo $start; ?>',
      end: '<?php echo $end; ?>',
} <?php endforeach; ?>

data

显然,由于它们处于foreach循环中,它会进入重复和非重复的事件对象。

events:[
    <?php 
    inside the foreach loop:
    ..........
     if ($dow == "") {
        ?>
        {
          id: '<?php echo $event['id']; ?>',
          title: '<?php echo $event['title']; ?>',
          color: '<?php echo $event['color']; ?>',
          start: '<?php echo $start; ?>',
          end: '<?php echo $end; ?>',
        },
 <?php }
       else {?>
        {
          id: '<?php echo $event['id']; ?>',
          title: '<?php echo $event['title']; ?>',
          color: '<?php echo $event['color']; ?>',
          start: '04:00',
          end: '05:00',
          dow: '<?php echo $dow; ?>',
          ranges: [{
                     start: '<?php echo $start; ?>', 
                     end: '<?php echo $end; ?>',
                   }]
       },
   <?php } ?>
<?php endforeach; ?>

1 个答案:

答案 0 :(得分:0)

你想要的是完全可能的。正如我在评论中提到的,您所要做的就是修改eventRender函数以检查&#34;范围&#34;属性存在于正在呈现的事件上。如果是,则应用范围定义的重复规则。如果没有,那么只需让它正常渲染而不受干扰:

eventRender: function(event) {
  //only apply recurrence rules if the event has a "ranges" property
  if (event.ranges) {
    return (event.ranges.filter(function(range) { // test event against all the ranges

      return (event.start.isBefore(range.end) &&
        event.end.isAfter(range.start));

    }).length) > 0; //if it isn't in one of the ranges, don't render it (by returning false)
  } else {
    return true; //just allow the event to render normally if it's not recurring
  }
}

为此,您的活动可以具有以下结构:

非经常性的例子:

{
  title: 'Non Recurring Event',
  start: "2017-10-03T10:30:00",
  end: "2017-10-03T11:30:00",
  allDay: false
}

重复示例:

{
  id: 1,
  title: "Recurring Event",
  start: "10:00",
  end: "12:00",
  dow: [1,3,4],
  ranges: [{
      start: "2017-10-01T09:30:00",
      end: "2017-10-04T15:30:00"
    }, {
      start: 2017-10-05T10:00:00",
      end: 2017-10-15T13:30:00"
    }]
}

查看此处的工作演示,其中包含定期和非定期事件:http://jsfiddle.net/sbxpv25p/27/