如何更新fullCalendar中的事件?

时间:2013-08-28 20:59:20

标签: jquery json fullcalendar

我想在fullcalendar中更新我的json,这是我正在尝试做的事情。 我有一个JSON字符串,我直接尝试输入完整日历中的事件对象。

- >

var JSON[
    {
        "id": "1", // Optional
        "title": "Demo event", // Required
        "start": "2013-08-28 10:20:00", // Required
        "end": "2013-08-28 11:00:00", // Optional
        "allDay": false, // Optional
        "url": "http://google.com", // Optional, will not open because of browser-iframe security issues
        "className": "test-class", // Optional
        "editable": true, // Optional
        "color": "yellow", // Optional
        "borderColor": "red", // Optional
        "backgroundColor": "yellow", // Optional
        "textColor": "green" // Optional
    },
    {
        "id": "2", // Optional
        "title": "Demo event 2", // Required
        "start": "2013-08-27 10:20:00", // Required
        "end": "2013-08-27 11:00:00", // Optional
        "allDay": false, // Optional
        "url": "http://google.com", // Optional, will not open because of browser-iframe security issues
        "className": "test-class", // Optional
        "editable": true, // Optional
        "color": "yellow", // Optional
        "borderColor": "red", // Optional
        "backgroundColor": "yellow", // Optional
        "textColor": "green" // Optional
    }
];

然后我想将一些下拉事件(未在小提琴中显示)的JSON修改为新字符串并尝试在日历上获取新事件。

fullCalendar不会生效。

http://jsfiddle.net/pratik24/u8Ksw/28/

感谢您的帮助。欣赏它。

2 个答案:

答案 0 :(得分:15)

您没有调用正确的fullCalendar方法来呈现新事件。

这不起作用,因为它只是为了第一次渲染事件:

   $("#demo-calendar").fullCalendar('renderEvents', JSON);

相反,您需要删除日历上的事件并刷新它们:

   $("#demo-calendar").fullCalendar('removeEvents'); 
   $("#demo-calendar").fullCalendar('addEventSource', JSON); 

检查小提琴:http://jsfiddle.net/shaunp/u8Ksw/29/

注意有一个名为refetchEvents的fullCalendar方法,但它不适用于您创建的事件数组,因此您必须手动关闭事件并重新添加事件源。

答案 1 :(得分:0)

您需要添加以下几行:

$("#demo-calendar").fullCalendar('removeEvents'); 
$("#demo-calendar").fullCalendar('addEventSource', JSON, true); 

将新事件添加到日历时,它们在切换月份时会消失。为了解决这个问题,在要添加到作用域的事件对象中添加stick: true