FullCalendar - 在 cookie 中保存事件答案

【问题标题】：FullCalendar - save events in cookieFullCalendar - 在 cookie 中保存事件
【发布时间】：2012-07-25 05:37:53
【问题描述】：

我正在尝试使用外部拖动功能创建一个 FullCalendar，您可以在其中将添加到日历中的事件保存在 cookie 中（我更愿意将其保存在服务器上，但这不是一个选项）。我正在使用 jquery cookie 插件来简化它。

到目前为止，我所拥有的是保存功能（我相信它正在工作）：

function save() {
    var eventsFromCalendar = $('#calendar').fullCalendar( 'clientEvents');
    $.cookie("DSCalendar", eventsFromCalendar, {expires: 1});
}

...但是当我下次打开它时，我无法让日历包含它。我试过这样做，但它似乎根本不起作用：

$(document).ready(function() {
     ....

        var savedEvents = $.cookie("DSCalendar");
        $('#calendar').fullCalendar({

            header: {
                left: 'prev,next today',
                center: 'title',
                right: 'month,agendaWeek,agendaDay'
            },
            events: savedEvents,
             ...........

是否有任何人以前这样做过，或者知道如何在不使用服务器的情况下保存事件？

【问题讨论】：

如果你调试这个，savedEvents 的值是多少？此外，您可能希望使用 JSON.stringify 和 JSON.parse 从 cookie 中存储和检索此对象。 $.cookie("DSCalendar", JSON.stringify(eventsFromCalendar), {expires: 1}); 和 var savedEvents = JSON.parse($.cookie("DSCalendar")); 我遇到了类似的问题 - 但我使用的是 LocalStorage 而不是 cookie。
@ganeshk - 每个已保存的事件的 savedEvents 值为 [object Object]，这不太正确。添加 JSON.stringify/parse 给了我{"length":1,"0":{},"context":{"jQuery17108956974661894247":1,"location":{}},"selector":"#calendar"} 并且日历没有显示在页面上。您找到使用 LocalStorage 的简单方法了吗？

标签： javascript fullcalendar jquery-cookie

【解决方案1】：

我认为 cookie 插件不能存储复杂的对象数组。这就是为什么我建议使用JSON.stringify。但是，.fullCalendar('clientEvents') 返回的 Object 数组包含递归 Object 引用 - 所以即使 JSON.stringify 也无法成功转换。

看看这个小提琴： http://jsfiddle.net/100thGear/v6tSd/

我在将它存储到 cookie 之前创建了一个临时对象数组，然后 JSON.stringify 和 JSON.parse 完美运行。

如果这有帮助，请告诉我。

【讨论】：

谢谢！这非常有帮助——尽管我最后选择了 localStorage，因为 cookie 似乎没有正确保存它。终于成功了！

【解决方案2】：

在 FullCalendar v1 中，如果您要远程加载数据，clientEvents 的内容会为每个事件包含一个名为“源”的键-对象对。该对包含远程数据的 URL，如果您尝试将 clientEvents 字符串化以将其保存或发送到需要字符串而不是对象数组的位置，则会返回错误“将循环结构转换为 JSON”。我使用的解决方法是使用以下脚本删除“源”键和对象：

var eventsFromCalendar = $('#calendar').fullCalendar('clientEvents');
for (var i = 0; i < eventsFromCalendar.length; i++) {
    delete eventsFromCalendar[i].source
    }
var jstrng = JSON.stringify(eventsFromCalendar);

【讨论】：