具有从数据库填充的多个资源的完整日历答案

【问题标题】：fullcalendar with multiple resources populated from database具有从数据库填充的多个资源的完整日历
【发布时间】：2021-09-10 08:23:00
【问题描述】：

我使用了免费版的完整日历，现在我需要在上面拥有多个资源。可以在免费版本中做到这一点吗？如果是的话，是否有人可以从数据库中填充它的示例？对于多种资源，我应该使用 fullcalendar 调度程序还是标准的 fullcaneldar 来完成这项工作

【问题讨论】：

从技术上讲，前端和后端使用什么框架？
@hotcakedev: MVC C# 和 javascript

标签： javascript c# fullcalendar

【解决方案1】：

我缺乏 C# 经验，但希望以下使用 JavaScript 的示例对您有所帮助。

首先，您可以使用完整日历的免费版本从多个资源中获取所有事件。

其次，这是使用多个资源的完整日历示例之一。

详情请咨询doc。

document.addEventListener('DOMContentLoaded', function () {
    var calendarEventsEl = document.getElementById('calendar-events');

    calendarEvents = new FullCalendar.Calendar(calendarEventsEl, {
        headerToolbar: false,
        contentHeight: 300,
        initialView: 'listUpcoming',
        views: {
            listUpcoming: {
                type: 'listMonth',
                duration: { months: 2 },
            },
            listAll: {
                type: 'listYear',
                duration: { years: 1 },
            },
        },
        eventDidMount: function (arg) {
          ...
        },

        dayHeaderDidMount: function (arg) {
          ...
        },
        eventSources: [
        ~~~~~~~~~~~~~~~
          // This is the approach how to get events from multiple resources
          {
            method: 'POST',
            url: '/calendar/get_all_for_events_01/',
            extraParams: {
                get_type: 'upcoming',
                timezone: moment.tz.guess()
            }
          },
          {
            method: 'POST',
            url: '/calendar/get_all_for_events_02/',
            extraParams: {
                get_type: 'all',
                timezone: moment.tz.guess()
            },
          }
        ],
        eventSourceSuccess: function (content, xhr) {
            ...
        },

希望这会有所帮助。

【讨论】：