.net core Fullcalendar 通过给定月份获取数据

Question

我们将 fullcalendar 与 .net core-ef core 结合使用。我们通过将其传递到 fullcalendar 来获取所有事件数据。这意味着有很多事件。然后它会在本月默认使用这些数据创建事件日历。我想要的是让它变得懒惰。获取数据时，它只会返回给出月份的事件。在 c# 中public JsonResult GetEvents(E_Model model){     var list = _Service.GetEvents().ToList();   }在js ajax调用文件中function GetEvents() {          var events = [];        $.ajax({            type: "POST",            url: "/calHome/GetEvents",            data: { model: data },            success: function (data) {                calender.style.display = 'block';                          $.each(data, function (i, v) {                                           events.push({                        id: v.id,                        title: v.name,                        description: v.description,                    //i got start and end moment             start: moment(v.start),                    end: v.end != null ? moment(v.end) : null,});        })        GenerateCalender(events);}生成日历function GenerateCalender(events) {    $('#calender').fullCalendar('destroy');    $('#calender').fullCalendar({        contentHeight: 800,        firstDay: 1,        defaultDate: new Date(),        timeFormat: 'HH:mm', eventLimit: true,        events: events,}ajax GetEvents 在控制器中调用 GetEvents，它返回 json，然后 ajax 中的 GetEvents 调用 genaretecalendar。在aja中调用GetEvents方法时。我想在按下上一个或下一个按钮时做到这一点，它将向控制器提供月份并按月获取数据。我尝试听上一个事件，例如$('.fc-prev-button').one('click',function (e) {                console.log('prev, do something');            });       新的 events: {            type: "POST",            url: "/home/GetEvents",            data: function () { // a function that returns an object                return {                                     };            }控制器[HttpPost] public JsonResult GetEvents(FiltModel model)                               //model includes string start, end

Answer 1

实现此目的的最佳方法是将事件用作完整日历文档中描述的JSON 提要模式。

本质上它的工作原理是这样的：如果您告诉 fullCalendar 控制器操作的 URL，每当日历中的日期范围发生变化时（并且它还没有下载该日期范围的事件），它就会自动向服务器发出新请求。它还会自动将“开始”和“结束”日期参数附加到请求中 - 因此您的服务器所要做的就是读取这些参数并在数据库查询中使用它们来过滤返回到日历的结果。您还可以选择将其他相关数据附加到请求中 - 例如其他过滤器选项。

因此，在您的情况下，您最终会得到如下代码：

JavaScript - fullCalendar 事件配置：

events: {

  type: "POST",

  url: "/home/GetEvents",

  data: function () { // a function that returns an object

  return {

    //your filter object goes here

  };

}

控制器：

[HttpPost]

public JsonResult GetEvents(FiltModel model) {

   //...where the FiltModel class includes start and end parameters - ideally these should be DateTime objects, not strings.

   //... then, query the database using the filter options in the model, and return JSON in the format required by fullCalendar

}