CODEWITHSUNDEEP
javascriptjqueryfullcalendar
exrezzo
exrezzo

Reputation: 507

Update Fullcalendar event after creation?

When I create a new event, i POST it on the server with a tastypie REST API. When created, this event on the server has a new id, generated when is saved:

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}}')

}

},

I need to update the event on the client memory, because the event just created, has an event id like "fc_1" or something similar, but i need the DB id, because if i immediately drag o resize the event, i can't update it on server because it will try to PUT this event, but with the wrong id (like "fc_1").

Upvotes: 0

Views: 2252

Answers (1)

ShadeTreeDeveloper
ShadeTreeDeveloper

Reputation: 1581

in your renderEvent object, you could add id: 'pending'. Then in your success function you can use the fullcalendar clientEvents function to get the array of events and then use updateEvent to add your new id value:

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]);
        }
    }
}

Upvotes: 2

Related Questions