我有一个 div,我想在其中显示基于按钮点击的日历:
<label class="btn" onclick="getCalendar();"> Show Calendar </label>
<div id="calendarDiv">
</div>
该getCalendar()函数实现如下:
function getCalendar() {
var calendar = new FullCalendar.Calendar($("#calendarDiv"), {
plugins: ['dayGrid'],
header: {
left: 'title',
center: '',
right: 'today prev,next'
},
buttonText: {
today: 'Today'
},
defaultView: 'dayGridMonth',
defaultDate: '2019-09-12',
events: function(fetchInfo, successCallback, failureCallback) {
$.post('/Customer/GetCalendarEvents',
$.param({
selectedCountryIds: getSelectionsByName('cntName'),
fiscalYearEnd: '31/12/2018'
},
true),
function (res) {
var events = [];
console.log(res);
$.each(res,
function (index, value) {
events.push({
title: value.title,
start: value.start
});
});
successCallback(events);
})
.fail(function () {
failureCallback(alert('bla'));
});
}
});
calendar.render();
}
其中,GetCalendarEvents(selectedCountryIds, fiscalYearEnd)返回一个带有事件列表的 Json 数组,其构造如下:
public JsonResult GetCalendarEvents(List<int> selectedCountryIds, string fiscalYearEnd) {
// some initial steps to get finalList
// creating result array
var result = finalList.Select(r => new
{
title = r.Item2 + " : " + r.Item3,
start = r.Item1
});
return Json(result, JsonRequestBehavior.AllowGet);
}
有什么建议可能是一个问题,我该如何解决?我正在使用最新版本的 FullCalendar。
开满天机
相关分类