我使用完整的日历来显示每月学生的出勤率。当我点击上一个按钮数据正确加载但值没有显示在我的日历中。我可以在控制台中查看日期,但不能在日历中查看日期
$(document).on("click", ".fc-prev-button", function () {
getMonth();
});
$(document).on("click", ".fc-next-button", function () {
getMonth();
});
function getMonth() {
var date = $('div[id*=calendar1]').fullCalendar('getDate');
date = date.format('YYYY-MM-DD');
alert(date);
$('div[id*=calendar1]').fullCalendar({
header: {
left: 'prev,next today myCustomButton',
center: 'title',
right: 'month,agendaWeek,agendaDay'
}
});
$.ajax({
type: "POST",
contentType: "application/json",
data: "{Date:'" + date + "'}",
url: "attendance-full.aspx/GetEvents",
dataType: "json",
success: function (data) {
alert("Done");
console.log(data);
events: $.map(data.d, function (item, i) {
var event = new Object();
event.id = item.EventID;
event.start = new Date(item.StartDate);
event.title = item.EventName;
return event;
})
$("#calendar1").fullCalendar("refetchEvents");
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
debugger;
}
});
}
答案 0 :(得分:0)
我不完全确定您的getMonth()
打算做什么,但是当您更改月份时,Fullcalendar会自动处理加载和重新呈现新事件。如果您要更改几个月后更新显示的事件,则可以删除大部分代码,并使用以下内容。
初始化您的日历,包括获取活动的位置:
$('div[id*=calendar1]').fullCalendar({
header: {
left: 'prev,next today myCustomButton',
center: 'title',
right: 'month,agendaWeek,agendaDay'
},
events: "attendance-full.aspx/GetEvents",
});
那就是它! Fullcalendar将在首次初始化日历时查询您的事件源URL,然后在您更改月份或视图时再次查询。它会自动重新呈现新事件 - 您不需要编写代码来手动执行此操作。
每次Fullcalendar查询事件源时,它都会传递start
和end
个参数,因此您的服务器端代码应使用这些参数来确定要返回的事件。看起来您的代码正在使用Date
- 您应该将代码更新为start
和end
,或者use startParam
可以将start
更改为{ {1}}(尽管您可能也想使用Date
)。
Fullcalendar文档很好,您应该通读它们。查看the event source documentation,然后查看some of their examples。