[英]fullCalendar - addEventSource with the color option
我有一个将事件动态添加到日历的功能。
function AddEventSourceDetailed(act_id) {
$('#calendar').fullCalendar('addEventSource', function (start, end, callback) {
var startTime = Math.round($('#calendar').fullCalendar('getView').start.getTime() / 1000);
var endTime = Math.round($('#calendar').fullCalendar('getView').end.getTime() / 1000);
time = endTime - startTime;
//alert(time);
if (time <= 604800) {
$.ajax({
type: 'POST',
url: '/Employee/GetScheduleDetailedArray/',
async: false,
dataType: "json",
data: {
// our hypothetical feed requires UNIX timestamps
start: Math.round(start.getTime() / 1000),
end: Math.round(end.getTime() / 1000),
id: '@Model.selectedUserId',
act: act_id
},
success: function (doc) {
callback(doc);
},
error: function (xhr, status, error) {
document.appendChild(xhr.responseText);
}
}); //end ajax
} else {
callback();
}
});
}
问题是当以这种方式添加颜色时,我无法弄清楚如何为事件源分配颜色。
====编辑=====
好的,我发现了一种改变事件内部背景颜色的方法,我使用eventAfterRender及其元素对象将其与与颜色相关的事件列表进行比较。 我希望这会帮助某人,直到我找到更好的方法
$('#calendar').fullCalendar({
height: 600,
width: 700,
header: {
right: 'prev,next today',
center: 'title',
left: 'month,agendaWeek,agendaDay'
},
eventAfterRender: function (event, element, view) {
for (x = 0; x < activityColors[0].length; x++) {
if (event.id == activityColors[0][x]) {
element.children().css({ "background-color": "#" + activityColors[1][x] })
}
}
}
});
您可以使用:
$('#calendar').fullCalendar( 'addEventSource', {
url: "/url/goes/here",
color: '#05ABBD'
});
在您的函数中,ajax调用的结果是什么? 根据您代码中的内容(success:function(doc){callback(doc);}),我想成功时您会收到用json编码的事件数组,因此,您唯一需要添加颜色的就是定义字段color,服务器端脚本中每个事件的backgroundColor,borderColor,textColor。 希望这可以帮助。
一月
编辑:我还注意到您在else分支中调用callback()函数,这确实是多余的。 没有参数,调用回调是毫无意义的,因为它什么都不做(callbacks参数是要添加到fullcalendar的事件数组,因此没有参数=没有要添加的事件=甚至没有被调用)。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.