从日历中删除所有事件
2021-03-04
1347
我试图从我的日历中删除所有事件。我使用的是完整日历库 v4。日历呈现后,所有事件都通过 ajax 添加到日历中。
在我的脚本中,我有此代码用于创建一个空日历:
var calendar = new FullCalendar.Calendar(document.getElementById('calendar'), {
themeSystem: 'bootstrap4',
headerToolbar: {
left: 'prev next today',
center: 'title',
right: 'dayGridDay dayGridWeek dayGridMonth listMonth'
},
locale: config.lang,
initialView: 'dayGridMonth',
displayEventTime: true,
events: dbEvents,
eventClick: function(event, jsEvent, view) {
$('#alertNotify').html(alert[event]);
$('#alertNotify').notifyModal({
duration : -1,
placement : 'center',
type : alert['type'],
icon : true,
onLoad : function(el) {},
onClose : function(el) {}
});
},
}); // end calendar object
然后我使用此函数加载来自某个日期的所有事件:
function loadEvents(){
var url = new URL(window.location.href);
var day = url.searchParams.get("day");
var month = url.searchParams.get("month");
var year = url.searchParams.get("year");
console.log(day + "/" + month + "/" + year);
$.ajax({
url : 'loadEvents',
type : 'get',
dataType: 'json',
data : 'json',
success : function(data) {
dbEvents = data;
calendar.addEventSource(dbEvents); // add events with ajax data from array;
dbEvents = [];
},
failure: function() {
alert('there was an error while fetching events!');
},
color: 'red', // a non-ajax option
textColor: 'white', // a non-ajax option
});
}
我正在使用 dbEvents,它是一个用于从日期加载事件的数组。
现在我不使用从日期加载事件,因为我想删除之前的所有事件。为什么我要删除所有事件?我的意思是,我正在使用 ajax 加载所有事件,但如果我移动到下个月或第二天,我只想加载属于日期的事件。在我的控制器中,我将使用此日期进行查询。为什么我要这样做?为了不让我的网站超载。我认为在添加新闻事件之前,我应该先删除所有事件。实际上,我在网站上看到我可以使用这个:
$("#calendar").fullCalendar('removeEvents');
但我的控制台出现此错误:
$(...).fullCalendar is not a function
at calendarDate (calendarEvents.js:110)
at HTMLButtonElement.<anonymous> (calendarEvents.js:53)
at HTMLButtonElement.dispatch (jquery.min.js:2)
at HTMLButtonElement.v.handle (jquery.min.js:2)
另外,我读到我可以使用它:
calendar.remove();
但删除时出现此错误:
Uncaught TypeError: Cannot read property 'remove' of null
我还读到我可以使用它:
calendar.fullCalendar('removeEvents');
但返回我的第一个错误...
我的问题是:如何从日历中删除所有事件??也许我搞糊涂了,我会用另一种形式来做这件事,但我不知道。
我忘了我的框架是 Laravel 5.8
我感谢你们所有的帮助和回复。我来这里是为了学习
2个回答
如果有人需要 v5 中有一个函数 calendar.removeAllEvents()。
Alexander Kolinko
2022-08-11
您已经尝试过这种方法了吗
var listEvent = calendar.getEvents();
listEvent.forEach(event => {
event.remove()
});
Hudson Moreira da Cunha
2021-03-04