全日历 json 提要

Question

我正在尝试制作动态日历事件。当日期/月份发生变化时，它会调用控制器函数。我的控制器过滤来自 ajax 调用（开始，结束）的值。所以这些是我的功能

  events: function (start, end, callback) {
                    $.ajax({
                         type: "POST",
                        url: "/Home/GetData",
                        dataType: 'json',
//this automaticly adds Start and End param to controller. Datetime
                        data: {
                             
                        },
                        error: function (xhr, type, exception) { alert("Error: " + exception); },
                        success: function (response) {
                            console.log(response);
//Response works fine, it return all objects what I  need.
                        }
                        });
                      },

所以基本上这个函数调用GetData json form Home控制器，每个月都有开始和结束参数的变化。我也可以记录它来的这些数据。但是这个事件没有被填满。控制台日志中写着eventrender

  eventRender: function (event, element) {

                console.log("event");
                console.log(event);
--
event
undefined

它不会填充事件，但我也在其他页面中以相同的方式使用它，但它可以工作。

events: {
            type: "POST",
            url: "/home/GetEvents",
            data: function () { // a function that returns an object
               
                return {
                   
                };
            }
        },

我只需要添加它来填充事件。谢谢

我还添加了 evetnSoucers，但它是一样的

 eventSources: [

                   
                    {
                       
                        url: "/Home/GetData",
                        method: 'POST',
                        
                        failure: function () {
                            alert('there was an error while fetching events!');
                        }, success: function (response) {
                            console.log(response);
                            myfunc(response);
                        }
                       
                    }

                ],

新2

下面的这段代码使用 start、end 参数调用控制器并返回预期值。我可以调用另一个具有响应值的函数，也可以 console.log 这个响应值。当我添加回调来设置我的事件时，它说回调不是函数

 events: {
                    type: "POST",
                    url: "/home/GetData",
                    data: function (start, end, timezone, callback) { // a function that returns an object

                        return {
                            // dynamic_value: Math.random()
                        };
                    }, success: function (response) {
                       
                        callback(response);
                        console.log("response");
                        console.log(response);
                        some_func(response);
                        
                    }
                },

    

Answer 1

编辑： 正如@ADyson 在 cmets 中所指出的，假设您使用的是最新版本，我绕过了 FullCalendar 版本。我将签名更新为 v3，即使您使用它的方式有误。

我认为你被卡住了，因为你误解了events (as a fuction)。如果您查看文档，您会看到事件函数的签名是：

function( start, end, timezone, callback ) { }

地点：

• start 和 end 是表示日历需要事件范围的时刻。
• timezone 是描述日历当前时区的字符串/布尔值。
• callback 是一个必须在自定义事件函数生成其事件时调用的函数。

所以，如果你使用 AJAX，你可以这样做：

{
  events: function(start, end, timezone, callback) {
    const data = {
      start: start,
      end: end
      // ...
    }

    $.ajax({
      type: 'post',
      url: 'url',
      data: data,
      dataType: 'json'
    })
      .done(function(res) {
        if (res.error) {
          // Show error logic
          // ...
        } else {
          const events = res.data.events;
          callback(events);
        }
      })
      .fail(function(res){
        // Show error logic
        // ...
      });
    }
  }
}

您提出请求的方式可能会有所不同，但本质上，主要是在一切正常时调用callback()，或在出现问题时调用failureCallback()处理错误（如果存在）。因此，如果您需要自定义事件，您将能够通过eventRender 函数查看事件。

如果您有过滤器或类似的东西（或者只是需要刷新事件），您可以通过调用 .fullCalendar('refetchEvents') 来完成。记得在events: function (...) {} 上管理过滤数据。调用此函数将调用events 函数来获取和呈现事件。