Question

我使用的是FullCalendar jQuery插件：http://arshaw.com/fullcalendar/

我也在使用您可以将外部事件拖到日历上的示例：http://arshaw.com/js/fullcalendar-1.5.2/demos/external-dragging.html

现在，我有一个事件点击功能，如下所示：

eventClick: function(event) {

$.ajax({
type: "POST",
url: "ajax-schedule.php",
data: 'id=' + event.id + '&start=' + event.start + '&end=' + event.end,
success: function(data){ 

alert('done!');     
}
});


}

这会发布到文件“ajax-schedule.php”，其中数据被插入到mysql数据库中。

我想创建一个链接，点击后会获取所有新的/已更改的事件并发布如上所示的数据，而不是逐个发布。

类似的东西：

<a href="#" onclick="updateSchedule();">Update Schedule</a>

然后“updateSchedule”函数将发布所有数据。

看起来该解决方案可能涉及“clientEvents”方法：http://arshaw.com/fullcalendar/docs/event_data/clientEvents/ ......但我有点迷失在这里。

关于如何做到这一点的任何想法？

Answer 1

您可以创建一个数组来存储所有事件：

var arrayOfEvents = [];

$('#calendar').fullCalendar({
    ...
    drop: function(date) {
        ...
        // retrieve the dropped element's stored Event Object
        var originalEventObject = $(this).data('eventObject');

        // we need to copy it, so that multiple events don't have a reference to the same object
        var copiedEventObject = $.extend({}, originalEventObject);

        // Push the event into the array
        arrayOfEvents.push(copiedEventObject);
        ...
    },
    ...
)};

function updateSchedule()
{
    var data = "numOfEvents=" + arrayOfEvents.length;

    // You can get all events out of the array here
    for (var i = 0 ; i < arrayOfEvents.length ; i++) {
         var event = arrayOfEvents[i];
         data += "&id"    + i + "=" + event.id
               + "&start" + i + "=" + event.start
               + "&end"   + i + "=" + event.end;
    }

    // Make your ajax post here
    $.ajax({
        type: "POST",
        url: "ajax-schedule.php",
        data: data,
        success: function(response){ 
            alert('done!');     
        }
    });
}

所以在服务器端，你的代码可以得到“numOfEvents”，只需运行一个从0到numOfEvents的for循环来获取所有事件。

Answer 2

这是我计划在将来调整项目性能时实施的内容。我的总体想法是这样的：

创建处理程序，用于存储在fullcalendar中进行的每个更改，因此新事件，事件更新（拖放，调整大小，标题/描述/颜色/需要的任何内容），事件删除。我想最好的方法是创建“class”，它将成为fullcalendar本身的一部分，可以通过cource的选项进行调整，如果它不是fc的一部分，你需要在每个状态更改函数中调用它。
此处理程序存储事件数组，并提供一些将fc更改添加到队列中的基本方法。我的想法是使它基于事件，所以在数组中有一个由事件id定义的成员，它包含有关此事件的每个更新的信息。我想象这个工作的方式并不完全像每个事件都有自己的更新数组，服务器将按顺序运行。我想这样做，处理程序将被设置为每15/30 ...秒（将由用户设置）或用户调用（例如按下按钮）保存数据。在两次保存之间的时间内，队列将以所有更新合并为一个全局更改的方式填充（例如，如果您在日历中移动一个事件5次，调整大小3次并更改标题5次但最后它将会与最后一次保存时一样，没有任何内容发送到服务器进行保存，因为实际上没有进行任何更改。或者如果你这样做然后删除事件，那么保存所有更改然后删除它是毫无意义的事件，而不是该处理程序将只发送删除命令，因为此命令不受以前任何其他操作的影响。但是如果您将事件移动例如将来两天然后返回1天，它将计算它实际上只移动了一个前进一天，所以不会有任何不必要的数据发布到服务器）。
最好直接将它实现到fullCalendar插件，它也可以是独立的类/插件，它可以与任何类型的应用程序相关联，这些应用程序会对某些数据集进行大量更改，并且需要进行通信高效率以最大化速度（因此用户不会被缓慢的更新/保存所困扰）。通过确切地识别哪些字段可以进一步调整（我使用fc基本上作为谷歌日历，我可以改变颜色，描述，标题和更多字段，但是发送整个事件是没用的，因为它是如果仅举例如标题如果事件已更新并且仅发送那些，则更改，不需要发送保持相同的字段），因此绝对不会将冗余数据发送到服务器。我想我会这样做，因为每个事件都会在队列数组中有成员（如前所述），当事件的新成员被添加到队列时，它也会存储当前事件数据（仅用于比较，不会被发送）到服务器）以便与下一次更新进行进一步比较（如果有的话）。

希望你不会迷路并抓住我的漂移。这只是我对有用功能的想法，但我今年看不到自己在做什么，取决于学校/工作。它实际上并不难，至少不是我想象的那样，所以在我开始之前可能会有其他人会这样做：）

jQuery Fullcalendar - 如何一起更新所有已更改的事件而不是一个一个？

2 个答案: