如何使用全日历检查单击日历事件的条件

Question

我一直在代码点火器中使用全日历在日历上显示事件。单击这些事件后，其重定向到URL已传递。

但是我想检查一些条件并按照该更改URL，该怎么做？

这是我在视图中的代码

<script>
$('#calendar').fullCalendar({
     eventSources: [
         {
             events: function(start, end, timezone, callback) {
                 $.ajax({
                 url: '<?php echo base_url() ?>index.php/faculty_role/Dashboard/get_events',
                 dataType: 'json',
                 data: {
                 },
                 success: function(msg) {
                     var events = msg.events;
                     callback(events);
                 }
                 });
             }
         },
     ]
});
</script>

控制器中的代码

 public function get_events()
 {
     // Our Start and End Dates
     $this->load->library('session');
     $this->load->model("faculty_role/dashboard_model");
     $emp_id=$this->session->userdata['empid'];
     $events = $this->dashboard_model->get_events($emp_id);
     $data_events = array();
        foreach($events->result() as $r) {
       $url='';
       $color='';
       if($r->stats==0){
         $url= base_url().'index.php/faculty_role/Dashboard/view_student/'.$r->schedule_id.'/'.$r->end_time.'/'.$r->date;
         $color='Blue';
       }
       elseif($r->stats==1){
           $url='#';
           $color='Green';
       }
       elseif($r->stats==2){
            $url='#';
           $color='Red';
       }
        $data_events[] = array(
            "title" => $r->schedule_id.'|'.$r->module_name,
            "start" => $r->date.' '.$r->start_time,
            "end" => $r->date.' '.$r->end_time,
            "description"=>$r->fellowship_name.' '.$r->cohort_name,
            "url"=>$url,
            "backgroundColor"=>$color
                );
        }
        echo json_encode(array("events" => $data_events));
        exit();
 }

Answer 1

您需要处理"eventClick"回调，正如其名称所建议的那样，只要单击日历上的事件，该回调就会运行。你在那里写代码来决定做什么。在此函数中，您可以选择取消导航到事件的 URL 并执行其他操作。这是通过从回调函数返回false来完成的。

例如：

eventClick: function(calEvent, jsEvent, view) {
  //check whether the clicked event's start date (normalised to the start of the day for matching purposes) is later than today's date
  if (calEvent.start.startOf("day").isAfter(moment())) {
    return false; //this will prevent navigation to the event's URL
  }
}

有关工作演示，请参阅 http://jsfiddle.net/sbxpv25p/99/。

这一切都清楚地记录在完整的日历网站上：https://fullcalendar.io/docs/mouse/eventClick/