我目前正在尝试测试FullCalendar
(版本2.2.6)addEventSource
$('button').click(function() {
$("#calendar").fullCalendar('removeEventSource', cal_events_1);
$("#calendar").fullCalendar('addEventSource', cal_events_2);
});
但我总是收到此错误:
Uncaught TypeError: Cannot read property 'hasTime' of undefined
两个来源都是硬编码的,加载日历时,任何一个来源都会成功加载事件,所以没有日期不正确。
var cal_events_1 = [
{
events: [
{
title: 'event 1',
start: '2015-01-04',
color: 'tomato'
},
{
title: 'event 2',
start: '2015-01-09'
}],
color: '#55B2DA',
textColor: '#3c3c3c'
},
{
events: [
{
title: 'event 3',
start: '2015-01-06'
},
{
title: 'event 4',
start: '2015-01-07'
}],
color: 'rgb(255, 162, 71)',
textColor: '#3c3c3c'
},
{
events: [
{
title: 'event 5',
start: '2015-01-09'
},
{
title: 'event 6',
start: '2015-01-12'
}],
color: 'rgb(91, 228, 118)',
textColor: '#3c3c3c'
}];
var cal_events_2 = [
{
events: [
{
title: 'event 1',
start: '2015-01-04',
color: 'tomato'
},
{
title: 'event 2',
start: '2015-01-09'
},
{
title: 'event 3',
start: '2015-01-09'
}],
color: '#55B2DA',
textColor: '#3c3c3c'
},
{
events: [
{
title: 'event 4',
start: '2015-01-09'
},
{
title: 'event 5',
start: '2015-01-12'
}],
color: 'rgb(91, 228, 118)',
textColor: '#3c3c3c'
}];
加载日历:
$("#calendar").fullCalendar({
eventSources: cal_events_1 // or cal_events_2
});
仅在调用addEventSource
时才会显示错误。我不确定到底是什么错误。
更新
我知道addEventSource
和removeEventSource
的文档提到使用数组作为源但它看起来不起作用,cal_events_1
和cal_events_2
都是数组对象使用对象:
var my_events = {
events: [
{
title: 'event 1',
start: '2015-01-04',
color: 'tomato'
},
{
title: 'event 2',
start: '2015-01-09'
},
{
title: 'event 3',
start: '2015-01-09'
}
],
color: '#55B2DA',
textColor: '#3c3c3c'
};
$('button').click(function() {
$("#calendar").fullCalendar('removeEvents');
$("#calendar").fullCalendar('addEventSource', my_events);
});
答案 0 :(得分:6)
你需要结束时间。
试试这个:
var my_events = {
events: [
{
title: 'event 1',
start: '2015-01-04',
end: '2015-01-06',
color: 'tomato'
},
]
};
答案 1 :(得分:2)
我发现错误主要是针对事件的错误数据结构,“开始”或“结束”属性的空数据或源数据中的无效日期格式。
答案 2 :(得分:0)
addEventSource并不真正接受数组。我的建议是在每次迭代后迭代cal_events_1或cal_events_2以得到类似的内容:
$('#calendar').fullCalendar('addEventSource', {
events: [
{
title: 'event 5',
start: '2015-01-09'
},
{
title: 'event 6',
start: '2015-01-12'
}],
color: 'rgb(91, 228, 118)',
textColor: '#3c3c3c'
})
答案 3 :(得分:0)
我从数据库传递及时和 out time 。我通过将及时指定为开始并将结束时间指定为结束来修复此错误,因为 FullCalender.js 检查该变量的时间和时间,我忘了添加分号。 对于GenerateCalender函数。这是我的代码 -
var event_array = [];
var selectedEvent = null;
FetchEventAndRenderCalendar();
function FetchEventAndRenderCalendar() {
events = [];
$.ajax({
url: "/Home/GetEvents",
data: "",
type: "GET",
dataType: "json",
async: false,
cache: false,
success: function (data) {
alert("success");
$.each(data, function (i, v) {
event_array.push({
userid: v.UserId,
start: moment(v.LoginTime),
//end: moment(v.LogoutTime)
//start: moment(v.start),
end: v.LogoutTime != null ? moment(v.LogoutTime) : null
//color: v.themecolor,
//allday: v.isfullday
});
})
GenerateCalender(event_array);
},
error: function (error) {
alert('failed');
}
})
}
function GenerateCalender(event_array) {
$('#calender').fullCalendar({
events: event_array
});
}