Search code examples
javascriptfullcalendarfullcalendar-4

Why can't eventDragStop not edit the event in the callback? (FullCalendar v4)

I'm using fullcalendar (the v4 alpha) to arrange events.
I have an eventDragStop callback that I'm trying to use to set an extendedProp for an event, marking that the event has been altered.

eventDragStop: function (info) {
                        calendar.getEventById(info.event.id).setExtendedProp("extra2", true)
                }

Using the code above, it doesn't work. If I alert(info.event.id), I can see that the correct ID is being called for the event that has been dragged, and get no errors.

If I have three events on the calendar, with IDs: 1, 2, 3, and use the following code: 

eventDragStop: function (info) {
                        calendar.getEventById(1).setExtendedProp("extra2", true)
                }

So, explicitly stating to change ID number 1, rather than the event in the callback.
If I drag event number 1, this doesn't work either. However, if I drag event 2 or 3, it will work and change event 1.

Vice versa, any event I explicitly state, it will be able to change that event, providing that was not also the event that triggered the eventDragStop callback.

Can anyone tell me why this is?

Solution

  • https://fullcalendar.io/docs/v4/eventDragStop says (of itself as a callback)

    "It is triggered before the event’s information has been modified"

    So I think what is happening here is that fullCalendar effectively overwrites any change you make to the event data during this callback.

    I think this is because the event object maybe gets replaced with a new version (constructed based on its final resting place) some time after this callback runs.
    I haven't verified this by looking at the source code but it's a logical explanation for the issue you're seeing, and it also makes some sense that the event object would get updated (with new dates/times etc) after dragging is complete, and that this might in fact involve a full refresh of the object data at that time.

    Anyway, that's why when dragging event 1 you then fail to persist any updates to event 1's other data, but when dragging event 2 or 3 you are able to persist the changes to event 1 - because in that instance event 1's data is not being replaced at a later time as a result of the dragging being completed.

    Instead of using eventDragStop, you should modify the event during eventDrop (https://fullcalendar.io/docs/v4/eventDrop) instead. This callback occurs after fullCalendar has completely finished processing the dragging/dropping and updated the event times etc. Therefore any further changes you make to the event data I would expect should be preserved.