如何删除未保存的事件？

Question

我正在使用jquery和fullcalendar来安排活动。当用户选择时间段时，日历右侧会显示一个表单，用户可以在其中输入其他详细信息。

使用'select'回调，我会在日历上呈现一个临时事件，这样我的用户在填写表单时会有视觉反馈。

然而，当他们错误选择了一个时间段时，他们可以选择一个新的时间段。然而，这会在日历上呈现第二个（可能是第三个，第四个......）事件。

我以为我可以使用'eventAfterRender（event，element）'回调到element.siblings（）。remove（），但是这个失败了，因为每个renderEvent都会为日历上的每个事件调用eventAfterRender。 / p>

也许我缺少一个回调或方法，但正如我所看到的，没有简单的方法来删除“未保存”的事件。

以下是一些示例代码。

var fullCal = '';
$(function() {
    fullCal = $('#fullcalendar').fullCalendar({
        // options
        select: SelectDate,
        eventAfterRender: function(event, element) { 
            // this does not work as it simply just keeps the last event in the DOM.
            element.siblings().remove()
        },
        viewDisplay: UnselectDate  // hides and clears the form, intended behavior

    });

});

function SelectDate(startDate, endDate, allDay, jsEvent, view) {
    $('#BijlesForm').show();

    var BijlesEvent = {start: startDate, end: endDate, title: 'Bijles', allDay: false};
    fullCal.fullCalendar('renderEvent', BijlesEvent);

    //fill the form
}

Answer 1

好的，傻傻的我。它一定是疲劳或其他什么，但我发现如何自己做。

我删除了eventAfterRender回调并将我的SelectDate函数更改为：

function SelectDate(startDate, endDate, allDay, jsEvent, view) {
    $('#BijlesForm').show();

    fullCal.fullCalendar( 'removeEvents', 'unsaved' )
    var BijlesEvent = {start: startDate, end: endDate, title: 'Bijles', allDay: false, id: 'unsaved'};
    fullCal.fullCalendar('renderEvent', BijlesEvent);
}

这就像一个魅力。这也是首选的做事方式，还是应该以不同方式完成？