创建后更新Fullcalendar事件

Update Fullcalendar event after creation?

本文关键字：事件 Fullcalendar 更新 创建      更新时间：2023-09-26

当我创建一个新事件时，我使用一个tastype REST API将它发布到服务器上。当创建时，服务器上的这个事件有一个新id，在保存时生成:

select: function (startDate, endDate, allDay, jsEvent, view) {
    /* after selection user will be promted for enter title for event.*/
    var title = prompt('Event Title:');
    /*if title is enterd calendar will add title and event into fullCalendar. */
}
if (title) {
    calendar.fullCalendar('renderEvent', {
            title: title,
            start: startDate,
            end: endDate,
            allDay: allDay
        },
        true // make the event "stick"
    );
    $.ajax({
        url: 'http://localhost:8000/calendar/api/events/events/',
        dataType: 'json',
        contentType: 'application/json; encode=UTF-8',
        type: 'POST',
        data: JSON.stringify({
            title: title,
            start: startDate,
            end: endDate,
            allDay: allDay,
            user: "/calendar/api/events/users/{{ user.id }}/"
        }),
        success: function (data) {
            // Could i do something here?
        }
    });
    console.log({{user.id}},'{{ user}}')
}
},

我需要更新客户端内存上的事件，因为事件刚刚创建，有一个像"fc_1"或类似的事件id，但我需要DB id，因为如果我立即拖动或调整事件大小，我不能在服务器上更新它，因为它会尝试PUT这个事件，但错误的id(如"fc_1")。

在你的renderEvent对象中，你可以添加id: 'pending'。然后，在成功函数中，可以使用fullcalendar clientEvents函数来获取事件数组，然后使用updateEvent添加新的id值:

success: function(data) {
    var newID = data.id;
    var events = calendar.fullCalendar('clientEvents');
    for(var i = 0; i < events.length; i++){
        if(events[i].id == 'pending') {
            events[i].id = newID;
            calendar.fullCalendar('updateEvent', events[i]);
        }
    }
}
相关文章：