cakePHP 3.0 中的 FullCalendar 不在日历上显示事件
FullCalendar in cakePHP 3.0 not displaying events on calendar
我正在升级到 cakePHP 3.0 并且几乎可以使用 FullCalendar 插件的所有功能,除了我无法在日历上填充任何事件。我不再收到错误消息,这使得这个问题很难解决。我的控制器方法如下所示:
public function feed($id=null)
{
$this->request->allowMethod(['get']);
$this->layout = "ajax";
$vars = $this->params['url'];
$conditions = ['conditions' => ['UNIX_TIMESTAMP(start) >=' => $vars['start'], 'UNIX_TIMESTAMP(start) <=' => $vars['end']]];
$events = $this->Events->find('all', $conditions);
foreach($events as $event) {
if($event->all_day == 1) {
$allday = true;
$end = $event->start;
} else {
$allday = false;
$end = $event->end;
}
$data[] = array(
'id' => $event->id,
'title'=>$event->title,
'start'=>$event->start,
'end' => $end,
'allDay' => $allday,
'url' => Router::url('/') . 'full_calendar/events/view/'.$event->id,
'details' => $event->details,
'className' => $event->event_type->color
);
}
$this->set("json", json_encode($data));
}
我的观点是:
<?php
/*
* View/FullCalendar/index.ctp
* CakePHP Full Calendar Plugin
*
* Copyright (c) 2010 Silas Montgomery
* http://silasmontgomery.com
*
* Licensed under MIT
* http://www.opensource.org/licenses/mit-license.php
*/
?>
<div class="page-width">
<script type="text/javascript">plgFcRoot = "/<site name>/" + "full_calendar"; console.log(plgFcRoot);</script>
<?php
echo $this->Html->script(['/full_calendar/js/jquery-1.5.min', '/full_calendar/js/jquery-ui-1.8.9.custom.min', '/full_calendar/js/fullcalendar.min', '/full_calendar/js/jquery.qtip-1.0.0-rc3.min', '/full_calendar/js/ready']);
echo $this->Html->css('/full_calendar/css/fullcalendar');
?>
<div class="Calendar index">
<div id="calendar"></div>
</div>
<div class="actions">
<ul>
<li><?= $this->Html->link(__('New Event', true), ['controller' => 'events', 'action' => 'add']) ?></li>
<li><?= $this->Html->link(__('Manage Events', true), ['controller' => 'events']) ?></li>
<li><?= $this->Html->link(__('Manage Events Types', true), ['controller' => 'event_types']) ?></li>
</ul>
</div>
</div>
我的ready.js是:
/*
* webroot/js/ready.js
* CakePHP Full Calendar Plugin
*
* Copyright (c) 2010 Silas Montgomery
* http://silasmontgomery.com
*
* Licensed under MIT
* http://www.opensource.org/licenses/mit-license.php
*/
// JavaScript Document
$(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',
firstHour: 8,
weekMode: 'variable',
aspectRatio: 2,
editable: false,
events: plgFcRoot + "/events/feed",
eventRender: function(event, element) {
element.qtip({
content: event.details,
position: {
target: 'mouse',
adjust: {
x: 10,
y: -5
}
},
style: {
name: 'light',
tip: 'leftTop'
}
});
},
eventDragStart: function(event) {
$(this).qtip("destroy");
},
eventDrop: function(event) {
var startdate = new Date(event.start);
var startyear = startdate.getFullYear();
var startday = startdate.getDate();
var startmonth = startdate.getMonth()+1;
var starthour = startdate.getHours();
var startminute = startdate.getMinutes();
var enddate = new Date(event.end);
var endyear = enddate.getFullYear();
var endday = enddate.getDate();
var endmonth = enddate.getMonth()+1;
var endhour = enddate.getHours();
var endminute = enddate.getMinutes();
if(event.allDay == true) {
var allday = 1;
} else {
var allday = 0;
}
var url = plgFcRoot + "/events/update?id="+event.id+"&start="+startyear+"-"+startmonth+"-"+startday+" "+starthour+":"+startminute+":00&end="+endyear+"-"+endmonth+"-"+endday+" "+endhour+":"+endminute+":00&allday="+allday;
$.post(url, function(data){});
},
eventResizeStart: function(event) {
$(this).qtip("destroy");
},
eventResize: function(event) {
var startdate = new Date(event.start);
var startyear = startdate.getFullYear();
var startday = startdate.getDate();
var startmonth = startdate.getMonth()+1;
var starthour = startdate.getHours();
var startminute = startdate.getMinutes();
var enddate = new Date(event.end);
var endyear = enddate.getFullYear();
var endday = enddate.getDate();
var endmonth = enddate.getMonth()+1;
var endhour = enddate.getHours();
var endminute = enddate.getMinutes();
var url = plgFcRoot + "/events/update?id="+event.id+"&start="+startyear+"-"+startmonth+"-"+startday+" "+starthour+":"+startminute+":00&end="+endyear+"-"+endmonth+"-"+endday+" "+endhour+":"+endminute+":00";
$.post(url, function(data){});
}
})
});
如能提供帮助,我们将不胜感激。
有时我会在控制台中收到此错误,但不是每次都这样:
GET http://localhost//full_calendar/events/feed?start=1433052000&end=1436076000&_=1433266131989 404(未找到)
我刚刚解决了我的问题。我使用了一个排除过程,发现我的条件数组为 cakePHP 3.0 设置不正确,所以这是一个蛋糕问题。而不是
CakePHP 2.x 语法
$conditions = array('conditions' => array('UNIX_TIMESTAMP(start) >=' => $vars['start'], 'UNIX_TIMESTAMP(start) <=' => $vars['end']));
$events = $this->Event->find('all', $conditions);
是:
CakePHP 3.x 语法
$conditions = ['UNIX_TIMESTAMP(start) >=' => $vars['start'], 'UNIX_TIMESTAMP(start) <=' => $vars['end']];
$events = $this->Events->find('all', $conditions)->contain(['EventTypes']);
数组中没有条件设置,你只需设置我从 cakePHP 文档中的这个例子得到的条件:
$this->loadModel('Articles');
$recentArticles = $this->Articles->find('all', [
'limit' => 5,
'order' => 'Articles.created DESC'
]);
我正在升级到 cakePHP 3.0 并且几乎可以使用 FullCalendar 插件的所有功能,除了我无法在日历上填充任何事件。我不再收到错误消息,这使得这个问题很难解决。我的控制器方法如下所示:
public function feed($id=null)
{
$this->request->allowMethod(['get']);
$this->layout = "ajax";
$vars = $this->params['url'];
$conditions = ['conditions' => ['UNIX_TIMESTAMP(start) >=' => $vars['start'], 'UNIX_TIMESTAMP(start) <=' => $vars['end']]];
$events = $this->Events->find('all', $conditions);
foreach($events as $event) {
if($event->all_day == 1) {
$allday = true;
$end = $event->start;
} else {
$allday = false;
$end = $event->end;
}
$data[] = array(
'id' => $event->id,
'title'=>$event->title,
'start'=>$event->start,
'end' => $end,
'allDay' => $allday,
'url' => Router::url('/') . 'full_calendar/events/view/'.$event->id,
'details' => $event->details,
'className' => $event->event_type->color
);
}
$this->set("json", json_encode($data));
}
我的观点是:
<?php
/*
* View/FullCalendar/index.ctp
* CakePHP Full Calendar Plugin
*
* Copyright (c) 2010 Silas Montgomery
* http://silasmontgomery.com
*
* Licensed under MIT
* http://www.opensource.org/licenses/mit-license.php
*/
?>
<div class="page-width">
<script type="text/javascript">plgFcRoot = "/<site name>/" + "full_calendar"; console.log(plgFcRoot);</script>
<?php
echo $this->Html->script(['/full_calendar/js/jquery-1.5.min', '/full_calendar/js/jquery-ui-1.8.9.custom.min', '/full_calendar/js/fullcalendar.min', '/full_calendar/js/jquery.qtip-1.0.0-rc3.min', '/full_calendar/js/ready']);
echo $this->Html->css('/full_calendar/css/fullcalendar');
?>
<div class="Calendar index">
<div id="calendar"></div>
</div>
<div class="actions">
<ul>
<li><?= $this->Html->link(__('New Event', true), ['controller' => 'events', 'action' => 'add']) ?></li>
<li><?= $this->Html->link(__('Manage Events', true), ['controller' => 'events']) ?></li>
<li><?= $this->Html->link(__('Manage Events Types', true), ['controller' => 'event_types']) ?></li>
</ul>
</div>
</div>
我的ready.js是:
/*
* webroot/js/ready.js
* CakePHP Full Calendar Plugin
*
* Copyright (c) 2010 Silas Montgomery
* http://silasmontgomery.com
*
* Licensed under MIT
* http://www.opensource.org/licenses/mit-license.php
*/
// JavaScript Document
$(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',
firstHour: 8,
weekMode: 'variable',
aspectRatio: 2,
editable: false,
events: plgFcRoot + "/events/feed",
eventRender: function(event, element) {
element.qtip({
content: event.details,
position: {
target: 'mouse',
adjust: {
x: 10,
y: -5
}
},
style: {
name: 'light',
tip: 'leftTop'
}
});
},
eventDragStart: function(event) {
$(this).qtip("destroy");
},
eventDrop: function(event) {
var startdate = new Date(event.start);
var startyear = startdate.getFullYear();
var startday = startdate.getDate();
var startmonth = startdate.getMonth()+1;
var starthour = startdate.getHours();
var startminute = startdate.getMinutes();
var enddate = new Date(event.end);
var endyear = enddate.getFullYear();
var endday = enddate.getDate();
var endmonth = enddate.getMonth()+1;
var endhour = enddate.getHours();
var endminute = enddate.getMinutes();
if(event.allDay == true) {
var allday = 1;
} else {
var allday = 0;
}
var url = plgFcRoot + "/events/update?id="+event.id+"&start="+startyear+"-"+startmonth+"-"+startday+" "+starthour+":"+startminute+":00&end="+endyear+"-"+endmonth+"-"+endday+" "+endhour+":"+endminute+":00&allday="+allday;
$.post(url, function(data){});
},
eventResizeStart: function(event) {
$(this).qtip("destroy");
},
eventResize: function(event) {
var startdate = new Date(event.start);
var startyear = startdate.getFullYear();
var startday = startdate.getDate();
var startmonth = startdate.getMonth()+1;
var starthour = startdate.getHours();
var startminute = startdate.getMinutes();
var enddate = new Date(event.end);
var endyear = enddate.getFullYear();
var endday = enddate.getDate();
var endmonth = enddate.getMonth()+1;
var endhour = enddate.getHours();
var endminute = enddate.getMinutes();
var url = plgFcRoot + "/events/update?id="+event.id+"&start="+startyear+"-"+startmonth+"-"+startday+" "+starthour+":"+startminute+":00&end="+endyear+"-"+endmonth+"-"+endday+" "+endhour+":"+endminute+":00";
$.post(url, function(data){});
}
})
});
如能提供帮助,我们将不胜感激。 有时我会在控制台中收到此错误,但不是每次都这样: GET http://localhost//full_calendar/events/feed?start=1433052000&end=1436076000&_=1433266131989 404(未找到)
我刚刚解决了我的问题。我使用了一个排除过程,发现我的条件数组为 cakePHP 3.0 设置不正确,所以这是一个蛋糕问题。而不是
CakePHP 2.x 语法
$conditions = array('conditions' => array('UNIX_TIMESTAMP(start) >=' => $vars['start'], 'UNIX_TIMESTAMP(start) <=' => $vars['end']));
$events = $this->Event->find('all', $conditions);
是:
CakePHP 3.x 语法
$conditions = ['UNIX_TIMESTAMP(start) >=' => $vars['start'], 'UNIX_TIMESTAMP(start) <=' => $vars['end']];
$events = $this->Events->find('all', $conditions)->contain(['EventTypes']);
数组中没有条件设置,你只需设置我从 cakePHP 文档中的这个例子得到的条件:
$this->loadModel('Articles');
$recentArticles = $this->Articles->find('all', [
'limit' => 5,
'order' => 'Articles.created DESC'
]);