如何显示数据库中的数据以在完整日历上显示？

Question

我试图显示要在完整日历中显示的数据库中的数据，但数据不会出现在完整日历中，我尝试在几个集成此功能的网络教程中查看参考，但它仍然没有工作

我的参考：

1. https://www.patchesoft.com/fullcalendar-with-php-and-codeigniter

2. https://www.brianrevie.com/how-to-add-full-calendar-codeigniter

3. 如何在 fullcalendar 中随时间显示从数据库中获取事件

我有以下数据

[{"title": "Work", "start": "2019-08-01", "end": "2019-08-01" },{"title": "Work", "start": "2019-08-02","end": "2019-08-02"}]

这是我的js

document.addEventListener('DOMContentLoaded', function() {
  var calendarEl = document.getElementById('calendar');
  var calendar = new FullCalendar.Calendar(calendarEl, {
    plugins: [ 'dayGrid' ],
    height: 440,
    editable: true,
    eventSources: [
      {
        color: '#306EFE',   
        textColor: '#ffffff',
        events: "<?= base_url('UserDashboard/getAbsen'); ?>"
        // events: [{
        //   title: 'My Big Event',
        //   start: '2019-12-09',
        //   end: '2019-12-10'
        // },
        // {
        //   title: 'My Second Big Event',
        //   start: '2019-12-11',
        //   end: '2019-12-13'
        // },
        // {
        //   title: 'My Second Big Event',
        //   start: '2019-11-11',
        //   end: '2019-11-13'
        // },]
      }
    ]
  });
  calendar.render();
});

这是我的控制器

public function getAbsen() {
    $month = date('11');
    $year = date('Y');
    $id_karyawan = 26;
    // $data = $this->m_data->rekapAbsen($id_karyawan, $month, $year);
    $data = $this->m_data->rekapAbsenFullCalendar($id_karyawan);
    foreach ($data as $val) {
        $id = $val["id_attendance"];
        $tgl_db = $val["date_log"];
        $tgl = date('Y-m-d', strtotime($tgl_db));
        $d = $val["days"];
        $c = $val["check_in"];
        $o = $val["check_out"];
        if ($d == 'Saturday') {
            $days = 'Day Off';
        } if ($d == 'Sunday') {
            $days = 'Day Off';
        } else {
            if ($c == '00:00:00') {
                $days = 'Day Off';
            } else {
                $days = 'Work';
            }
        }

        $data_array[] = array(
            // 'id_attendance' => $id,
            'title' => $days,
            'start' => $tgl,
            'end' => $tgl,
            // 'allday' => '0'
        );
    }
    // var_dump($data);
    echo json_encode($data_array);
}

这是我的全日历，数据没有显示

错在哪里？

Answer 1

文档显示有几种方法可以指定事件的 JSON 提要。

最简单的选择就是：

events: '/myfeed.php'

或者，如果您还想指定一些选项，则可以使用扩展形式：

eventSources: [
{
    url: '/myfeed.php',
    color: 'yellow',
    textColor: 'black'
}

您的代码不使用这两种格式中的任何一种 - 您有eventSources但没有url ，并且有events 。

更新您的代码如下：

eventSources: [{
    color: '#306EFE',   
    textColor: '#ffffff',
    url: "<?= base_url('UserDashboard/getAbsen'); ?>"
}]

您的其余代码工作正常，这是一个有效的 jsFiddle 。