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

Question

我们正在使用带有 .net core-ef core 的 fullcalendar。我们通过将所有事件数据传递给 fullcalendar.That 来获取所有事件数据，这意味着很多 event.Then 它会在本月默认使用这些数据创建事件日历。我想要的是让它变得懒惰。获取数据时，它将 returns 仅给出月份的事件。

在 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 returns 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

实现此目的的最佳方法是使用 fullCalendar 文档中描述的 events as JSON feed 模式。

基本上它是这样工作的：如果你告诉 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
}

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

.net core Fullcalendar get data by giving month

javascript

c#

fullcalendar

asp.net-core

fullcalendar-3