javascript - fullcalendar - 当点击上一个/下一个时，移动的事件再次恢复到旧日期

Question

我在我的应用程序中使用 fullcalendar(v2.0.0)。从数据库和用户显示的所有事件都可以拖放和更新事件。一切正常，除了点击全日历的下一个/上一个按钮时，丢弃的事件再次进入旧日期。

检查我的 fiddle http://jsfiddle.net/Manivasagam/3E8nk/1021/

$('#calendar').fullCalendar({
events:"/FullcalendarProject/FullCalendarChecking" 
  // my events will be like this from DB [{title: 'Plants',start: '2015-05-18'}, {title: 'Animals',start: '2015-05-23'}]

});

确切的问题是如果我将 Plants 事件拖放到 2015-05-20 然后它移动到 2015-05-20 但如果我单击 next/prev 然后再次移动事件返回到 2015 年 5 月 18 日。

为什么会这样？如何解决这个问题？

Answer 1

您需要编写您的日历的放置事件回调，您将在其中将新日期发送到服务器，服务器将更新数据库中的事件日期，因此下次它会带有更新的日期如下

$('#calendar').fullCalendar({
events:"/FullcalendarProject/FullCalendarChecking" ,
  // my events will be like this from DB [{title: 'Plants',start: '2015-05-18'}, {title: 'Animals',start: '2015-05-23'}]
eventDrop: function (event, delta, minuteDelta, allDay, revertFunc) {
                console.log(event);
//asking for confirmation from user using $.prompt you can skip and send direct ajax
                $.prompt("Are you sure you want to move the events "+delta+" days?", {
                    title: "Are you Sure?",
                    buttons: { "Yes": true, "No": false },
                    submit: function (e, v, m, f) {
                        // use e.preventDefault() to prevent closing when needed or return false.
                        // e.preventDefault();
                        if (v)
                        {
                            $.ajax({
                                url: "/modules/crm_events/support/changeEventDate.php",
                                data: { id: event.id, changeDays: delta , table:event.className[2] , part:event.part },
                                type: "GET",
                                dataType: "json",
                            }).done(function (data) {

                            });
                        }
                        else
                        {
                            revertFunc();
                        }
                    }
                });
            },
});