首页 > 解决方案 > Fullcalendar 4:将 Json Feed 与 MVC 结合使用

问题描述

由于 StackOverflow 的大多数帖子都是关于 Fullcalender V3 的,而且我使用的是第 4 版,所以我想问如何将你的 fullcalendar 连接到服务器。我正在使用 MVC,我似乎没有让我的日历通过 Json Event Feed 加载我的事件。我没有收到任何错误,并且响应实际上在那里,只是没有生成事件......

控制器:

public JsonResult GetCalendarInformation(int calendarIndex, DateTime start, DateTime end)
    {
        IList<CalenderEvent> calenderEvents = new List<CalenderEvent>();

        calenderEvents.Add(new CalenderEvent
        {
            Id = 1,
            Title = "Google search",
            Start = DateTime.Now.Ticks,
            End = DateTime.Now.AddHours(4).Ticks,
            Description = "test",
            Information = "test"
        });


        return Json(new
        {
            events = calenderEvents
        }, JsonRequestBehavior.AllowGet);

    }

}

虚拟机:

public class CalenderEvent
{
    public int Id { get; set; }
    public string Title { get; set; }
    public long Start { get; set; }
    public long End { get; set; }
    public string Description { get; set; }
    public string Information { get; set; }
}

Javascript:

var calendar = new FullCalendar.Calendar(calendarEl, {            
        events: {
            url: $globfun.createAbsoluteUrlToServer("HOST/GetCalendarInformation"),
            extraParams: {
                calendarIndex: '1'
            },
            success: function (doc) {
                var d = doc; // -> Response
            }
        }            
    });

响应看起来像这样:

Events[0]:{Id: 1, Title: "Google search", Start: 637112479258609900, End: 637112623258609900, Description: "test", Information: "test"}

但我也尝试了其他回应。

我还没有找到任何有关响应对象外观的文档。也许问题出在我的扩展道具“描述”和“信息”中?如果没有其他选项,我仍然可以通过 ajax 和

calendar.addEvent( event [, source ] )

但我不认为那是方式......

标签: fullcalendarfullcalendar-4

解决方案


最后,经过反复试验,我想出了如何使用一个类来设置和获取这些日历事件。

事件的结构保持不变,就像我手动定义它们一样,如下所示:

[
    { // this object will be "parsed" into an Event Object
      title: 'The Title',
      start: '2018-09-01', 
      end: '2018-09-02' 
    }
  ]

我的课现在看起来像这样......

 public class CalenderEvent
{
    public string id { get; set; }

    public string title { get; set; }

    public string start { get; set; }

    public string end { get; set; }

    public string description { get; set; }

    public string information { get; set; }
}

虽然我像这样将我的 DateTimes 解析为 ISO8601...

 public JsonResult GetCalendarInformation(int calendarIndex, DateTime start, DateTime end)
    {
        IList<CalenderEvent> calenderEvents = new List<CalenderEvent>();

        calenderEvents.Add(new CalenderEvent
        {
            id = "1",
            title = "Google search",
            start = DateTime.UtcNow.ToString("yyyy-MM-ddTHH\\:mm\\:ss"),
            end = DateTime.UtcNow.AddHours(4).ToString("yyyy-MM-ddTHH\\:mm\\:ss"),
            description = "test",
            information = "test"
        });
        return Json(calenderEvents, JsonRequestBehavior.AllowGet);
    }

我花了太长时间来设置这种通信......


推荐阅读