如何将JSON值发送到FullCalendar并在calend中显示事件

Question

0:
Title: "start"
description: "yes"
end: 1609286400000
id: 210
name: "xyz"
start: 1609286400000

这是我要在完整日历中显示的数组。你知道吗

下面是javascript的代码

$('#calendar').fullCalendar({
    // ... your code
    events: {
        url: "/appointments/get_events/",
        success: function(response) {
             results = JSON.parse(response)
             console.log(results)
             for (var i = 0; i < results.events.length; i++) {
               var counter = results.events[i];
               var title = counter.Title
               var start = counter.start

             }
        }
    },

    });

我不知道如何将数组值发送到日历。我尝试了太多的解决方案，但无法理解。有人帮我吗。我正在使用fullCalendar 1.6.4。你知道吗

Answer 1

如果需要在下载事件数据之后对其进行一些定制处理，那么需要使用events-as-a-function模式，如in the documentation所述。然后提供一个回调函数，用于将事件传递回fullCalendar。你知道吗

唯一的缺点是这意味着您需要自己负责管理AJAX调用。下面是一个使用fetch()的简单示例

events: function(start, end, callback) {
   fetch("/appointments/get_events/")
     .then((resp) => resp.json()) // Transform the JSON data into a variable
     .then(function(data) { 
        var eventsList = [];
        for (var i = 0; i < data.events.length; i++) {
          var event = {
            title: data.events[i].Title,
            start: moment(data.events[i].start)
          };
          eventsList.push(event);
        }
        callback(eventsList);
     });
}

演示：http://jsfiddle.net/Le507sqb/1/

当然，另一种方法是修改服务器端代码，以便它以fullCalendar可以理解的正确格式输出JSON。如果您这样做了，那么您可以简单地指定您的事件URL并让fullCalendar完成其余的工作：

events: "/appointments/get_events/"