必须从空数据中重新绘制时，FullCalendar 为空

Question

我已经尝试调试这个问题好几天了，但一无所获。

我正在使用带有最新 Fiddle 演示的 FullCalendar here

我的数据集如下所示。

var myDataset = {
    "classes": [
        [{
            "name": "ECEC 301 Advanced Programming for Engineers Lecture",
            "days": "MWF",
            "times": "02:00 pm - 03:20 pm",
            "crn": "11215"
        }, {
            "name": "ECEC 301 Advanced Programming for Engineers Lab",
            "days": "W",
            "times": "09:00 am - 10:50 am",
            "crn": "11216"
        }],
        [{
            "name": "ECEC 301 Advanced Programming for Engineers Lecture",
            "days": "MWF",
            "times": "02:00 pm - 03:20 pm",
            "crn": "11215"
        }, {
            "name": "ECEC 301 Advanced Programming for Engineers Lab",
            "days": "F",
            "times": "02:00 pm - 03:50 pm",
            "crn": "11217"
        },
        {
        "name": "SOC 101 Introduction to Sociology Lecture",
        "days": "TBD",
        "times": "",
        "crn": "11044",
        "campus": "Online",
        "enrollment": "CLOSED",
        "short_name": "SOC 101 Lecture"
        }
        ]
    ]
};

在实际代码中，myDataset 对象通过 AJAX 调用动态更新。

数据是通过我写的 API 更新的，它提供了结果过滤功能，因此用户可以设置参数来更新日历视图（这会更改 myDataset）。

我遇到的一个问题是，当我设置过滤器以使 myDataset 为空，然后取消过滤所有内容以使 myDataset 再次具有数据时，我的 FullCalendar 视图将只是空白，甚至尽管里面有数据，并且正在推送事件（我已经检查过了）。

问题似乎源于 removeEvents 方法，每次日历需要呈现新事件以替换旧事件时都会调用该方法：

        // Clear all events to prepare for the next set of events.
        $('#calendar').fullCalendar('removeEvents');

        // Add events from JSON data
        $('#calendar').fullCalendar('addEventSource',
            function(start, end, timezone, callback) {
                var events = [];
                var overlap = [];
                ....

我尝试用以下方式关闭此方法：

        // Clear all events to prepare for the next set of events.
        $('#calendar').fullCalendar('rerenderEvents');

但是，这只是在现有事件上绘制事件，因此结果是一堆重叠的事件相互叠加。

我试过 refetchEvents 和其他一些方法。我什至不确定它是否与 removeEvents.

有关

我的问题是 - 我该如何解决这个问题？如果问题没有像应该的那样详细，我深表歉意，但我真的不知道如何解决为什么没有事件被渲染的问题。我在上面显示的结果非常详细，从技术上讲我可以去展示我是如何调试所有内容的。

编辑：好的，所以 rerenderEvents 解决了这个问题。 rerenderEvents 的唯一问题是事件显示在先前事件的顶部 [当在多个事件数组之间切换时]。

Answer 1

您需要先调用 destroy 您的日历，然后再 re-initializing 它。为此，您可以致电 $('#calendar').fullCalendar('destroy');

在您调用 destroy 事件后设置您的 dataset

var myDataset = result;

最后初始化你的日历

$('#calendar').fullCalendar({...

必须从空数据中重新绘制时，FullCalendar 为空

FullCalendar is blank when having to be redrawn from empty data

javascript

jquery

fullcalendar