0

我正在使用 CakePHP 3.1,如果事件是硬编码的,我可以让事件显示在日历上。我还可以通过将数组粘贴到 jsbin 中来获取事件,然后使用 url 从 jsbin 获取 js 文件,如此处完整日历文档中所述然后使用标准 FullCalendar 的JSON 提要模板链接。我需要能够使用提要 url 来获取事件,以便动态添加事件。

你可以在这里看到我的 json feed 数组。您可以在此处的控制台中看到显示的对象。

控制器中的进给方法:

public function feed($id=null) {
    $this->viewBuilder()->layout('ajax');
    $vars = $this->request->query([]);
    $conditions = ['UNIX_TIMESTAMP(start) >=' => $vars['start'], 'UNIX_TIMESTAMP(start) <=' => $vars['end']];
    $events = $this->Events->find('all', $conditions)->contain(['EventTypes']);
    foreach($events as $event) {
        if($event->all_day === 1) {
            $allday = true;
            $end = $event->start;
        } else {
            $allday = false;
            $end = $event->end;
        }
        $json[] = array(
                'id' => $event->id,
                'title'=> $event->title,
                'start'=> $event->start,
                'end' => $end,
                'allDay' => $allday,
                'url' => Router::url(['action' => 'view', $event->id]),
                'details' => $event->details,
                'className' => $event->event_type->color
        );
    }
    $this->set('json', json_encode($json, JSON_HEX_QUOT | JSON_HEX_TAG));
    $this->set('_serialize', ['json']);
}

从 ready.js 文件渲染完整日历:

jQuery(document).ready(function ($) {

    // page is now ready, initialize the calendar...
    $('#calendar').fullCalendar({
        header: {
            left: 'title',
            center: '',
            right: 'today agendaDay,agendaWeek,month prev,next'
        },
        defaultView: 'month',
        fixedWeekCount: false,
        scrollTime: "08:00:00",
        aspectRatio: 2,
        editable: adminEdit,
        events: {
            url: 'https://www.utahreia.org/events/feed', //navigate to this url to see json feed array
            type: 'POST',
            success: function (data) {
                console.log(data);
            },
            error: function (data) {
                console.log(data);
            }
        },
        eventRender: function (event, element) {
            element.qtip({
                content: event.details,
                position: { 
                    target: 'mouse',
                    adjust: {
                        x: 10,
                        y: -5
                    }
                },
                style: {
                    name: 'light',
                    tip: 'leftTop'
                }
            });
        }
    })
});
4

2 回答 2

0

看起来像使用 $this->loadComponent('RequestHandler'); 在我的应用程序控制器中导致了问题。我从我的应用程序控制器中删除了它,它现在显示事件。

如果您想使用请求处理程序并且只有一项要序列化,您可以按照@ndm 的建议进行操作并使用:

$this->set('_serialize', 'your_variable');

如果您尝试通过序列化传递一个数组,它将包装您的 json 并且不适用于 FullCalendar:

$this->set('_serialize', ['your_variable']);
于 2016-01-04T21:10:34.907 回答
0

我相信您只需要指定提要网址或为事件添加功能

http://fullcalendar.io/docs/event_data/events_json_feed/

...
events: 'https://www.utahreia.org/events/feed',
...

或者

http://fullcalendar.io/docs/event_data/events_function/

...
events: function(start, end, timezone, callback) {
    $.ajax();
}
...

将事件源的内容粘贴到 jsbin 中并调用它以绕过访问控制允许的来源,它可以工作:示例 jsbin

于 2016-01-04T20:16:08.420 回答