我使用fullcalendar插件时遇到问题。我无法使用ajax从我的数据库中提取数据。
这是我的功能。
function fullCalendar() {
$.ajax({
type: 'get',
url: "../admin/phpfunction.php?getCalendar",
dataType: 'json',
success: function(data){
var datas = [];
var source = { events: [
$.each(data, function(index, item){
{
title: item.titles,
url: item.urls,
start: item.starts,
end: item.ends
}
});
]};
$('#calendar').fullCalendar( source );
}
});
}
我仍然是ajax的新手。
答案 0 :(得分:0)
我想分享我的所作所为,如果可以,我会很高兴
首先,你应该为fullcalendar初始化创建一个对象函数。所以你可以在你的ajax工作时随时调用。
var Calendar = {
//this is your html calendar div
init : function (data){
$('#calendar').fullCalendar({
theme: true,
// header: {
// left: 'prev,next today',
// center: 'title',
// right: 'month'
// },
buttonText: {
today: 'today',
week: 'week',
day: 'day'
},
events: typeof data === 'undefined' ? '' : data //check data is exists
});
},
//ajax data
fullCalendar : function (){
$.ajax({
type: 'get',
url: "../admin/phpfunction.php?getCalendar",
dataType: 'json',
success: function(data){
//you should make your data is like this object format return from db
// data = [{
// title: "a",
// url : "www.sdf",
// start: "2016-01-12 00:00:00",
// end : "2016-01-15 00:00:00"
// },
// {
// title: "b",
// url : "www.sdf",
// start: "2016-01-12 00:00:00",
// end : "2016-01-15 00:00:00"
// },
// {
// ...
// }];
//if ok with that above format just call init()
Calendar.init(data);
}
});
}
};
//this document ready function
$(document).ready(function(){
Calendar.init();//initialize calendar
Calendar.fullCalendar();//your ajax function
});
答案 1 :(得分:0)
希望它会对你有所帮助。干杯!!快乐编码
var _calenderEvents = [];
$.each(data, function(index, item){
_calenderEvents.push({
title: item.titles,
url: item.urls,
start: item.starts,
end: item.ends
});
});
$('#calendar').fullCalendar({
header: {
left: 'month,agendaWeek,agendaDay',
center: 'title',
right: 'prev,next today'
},
views: {
week: {
scrollTime: '00:00',
allDaySlot: false,
},
day: {
scrollTime: '00:00:00',
allDaySlot: false,
}
},
defaultDate: getCurrentDate(),
editable: false,
slotDuration: '00:15:00',
eventDurationEditable: true,
events: _calenderEvents,
slotEventOverlap: false,
});