如何在CodeIgniter中通过FullCalendar实现日历事件点击的条件判断与URL跳转修改

嘿，这个问题很好解决！你需要替换FullCalendar默认的直接跳转行为，改用eventClick回调来实现条件判断后的自定义跳转。我给你分两步来改：

第一步：修改控制器，移除默认url属性，改用扩展属性存储必要数据 #

原来的控制器里直接给事件绑定了url，这会让FullCalendar点击时直接跳转。现在我们把跳转需要的参数和判断条件（比如stats）存到FullCalendar的extendedProps字段里，让前端能拿到这些信息做判断：

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) {
        $color='';
        if($r->stats==0){
            $color='Blue';
        } elseif($r->stats==1){
            $color='Green';
        } elseif($r->stats==2){
            $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,
            "backgroundColor"=>$color,
            // 把判断和跳转需要的参数存到扩展属性里
            "extendedProps" => array(
                "stats" => $r->stats,
                "schedule_id" => $r->schedule_id,
                "end_time" => $r->end_time,
                "date" => $r->date
            )
        );
    }
    
    echo json_encode(array("events" => $data_events));
    exit();
}

第二步：在视图层添加eventClick回调，实现条件判断与跳转逻辑 #

现在在FullCalendar的配置里加上eventClick函数，这里可以完全自定义点击后的行为，根据stats的值决定跳转目标：

<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);
                    }
                });
            }
        },
    ],
    // 自定义事件点击逻辑
    eventClick: function(calEvent, jsEvent, view) {
        // 从扩展属性里取出后端传递的数据
        const stats = calEvent.extendedProps.stats;
        const scheduleId = calEvent.extendedProps.schedule_id;
        const endTime = calEvent.extendedProps.end_time;
        const date = calEvent.extendedProps.date;
        
        // 根据stats值执行不同逻辑
        if (stats === 0) {
            // stats为0时，跳转到原目标URL
            const targetUrl = '<?php echo base_url() ?>index.php/faculty_role/Dashboard/view_student/' + scheduleId + '/' + endTime + '/' + date;
            window.location.href = targetUrl;
        } else if (stats === 1) {
            // stats为1时的自定义逻辑，比如提示或跳转到其他页面
            alert('该事件已完成，无法跳转');
            // 若需要跳转其他页面：window.location.href = 'your-custom-url-here';
        } else if (stats === 2) {
            // stats为2时的逻辑
            alert('该事件已取消');
        }
    }
});
</script>

补充说明 #

• 移除原url属性是因为FullCalendar会优先执行默认跳转，绕过我们的自定义逻辑；
• extendedProps是FullCalendar专门用来存储自定义数据的字段，非常适合传递后端的额外参数；
• 在eventClick里你可以添加任意复杂的条件判断（比如结合当前用户权限、时间等），完全掌控跳转行为。

内容的提问来源于stack exchange，提问作者Pooja Dhoot