CODEWITHSUNDEEP
javascriptjqueryajaxeventsfullcalendar
Martin
Martin

Reputation: 375

eventDrop full calendar not moving the event

eventDrop: function(event, delta, revertFunc) {

    console.log(event.title + " is moved on " + event.start.format());
    var page = '../include/UpdateCalendarEvent.php';
    $("#dialog")
        .data('start', event.start.format())
        .data('title', event.title)
        .dialog({
            resizable: false,
            modal: true,
            height: 250,
            position: ['middle', 20],
            width: 500,
            title: event.start.format(),
            open: function(event, ui) {
                var start = $("#dialog").data('start');
                var title = $("#dialog").data('title');
                $("#dialog").html(title + " is moved on " + start);
            },
            close: function(event, ui) {
                revertFunc();
            },
            buttons: {
                Close: {
                    class: 'calendareventright',
                    text: 'Close',
                    click: function() {
                        revertFunc();
                        $(this).dialog('close');
                    }
                },
                Move: {
                    id: "calendareventadd",
                    class: 'calendareventleft',
                    text: 'Move',
                    click: function() {
                        var eventData;
                        eventData = {
                            id: event.id,
                            sysid: event.sysid,
                            start: event.start.format(),
                            end: event.end.format(),
                            title: event.title,
                            description: event.description,
                            otherinfor: event.otherinformation,
                            page: '../include/UpdateCalendarEvent.php'
                        };
                        console.log(JSON.stringify(eventData));
                        ajaxcall(eventData, page);
                        $(this).dialog('close');
                    }
                }
            }
        });

}

This is my eventDrop function in my full calendar. I sends data to ajax and update the database. The update works perfectly. My problem is when i move the event the dialog box appear and will ask the user to move the event or close. If the user choose close the event will revert. If the user choose to move the event will be updated up to this point it is ok. After clicking the move button the dialog will close. But the event is not moved to the date. But if the page is reload if will go the date where it was moved.

Scenario:

I have event in Nov.4 I move it to Nov.5 (the event is now in Nov.5) dialog box appears asking user to move or close. Clicking move the dialog box will close ajax is sent the database is updated but event will go back to Nov.4, If the page is reload the event will then move to Nov. 5

Expected:

I expect that after clicking move the event will stay in Nov. 5

Any idea is appreciated.

ADDITIONAL INFO

If I use the code from the documentation

eventDrop: function(event, delta, revertFunc) {

    alert(event.title + " was dropped on " + event.start.format());

    if (!confirm("Are you sure about this change?")) {
        revertFunc();
    }

},

It does as expected. No errors in console

Upvotes: 1

Views: 1016

Answers (1)

guradio
guradio

Reputation: 15565

There are two things you need to check first 

close: function(event, ui) {
    revertFunc();
},

And 

Move: {
    id: "calendareventadd",
    class: 'calendareventleft',
    text: 'Move',
    click: function() {
        var eventData;
        eventData = {
            id: event.id,
            sysid: event.sysid,
            start: event.start.format(),
            end: event.end.format(),
            title: event.title,
            description: event.description,
            otherinfor: event.otherinformation,
            page: '../include/UpdateCalendarEvent.php'
        };
        console.log(JSON.stringify(eventData));
        ajaxcall(eventData, page);
        $(this).dialog('close');
    }
}
}

After you move the event you call the close dialog and in your close dialog you have the revertFunc();.

Either do not close on move or don't revert in close function

Upvotes: 1

Related Questions