Данные URL-адреса Json -> нет ошибок, но не отображаются события

#json #fullcalendar #fullcalendar-5

#json #полный календарь #полный календарь-5

Вопрос:

Я не знаю, что я делаю не так. Попробуйте загрузить события в полном календаре по URL-адресу в формате Json. См. Ниже [1]. Это код в HTML [2]. Событие не отображается. URL работает, а также нет ошибок в окне консоли. В чем может быть проблема? Некоторые упоминали, что отсутствующая информация о названии может быть причиной отсутствия отображения. Но заголовок определен.

[1]

 HTTP/1.1 200 OK
Content-Type: application/json; charset=utf-8
Server: Microsoft-IIS/10.0
X-Powered-By: ASP.NET
Date: Tue, 24 Nov 2020 16:43:15 GMT
Connection: close
Content-Length: 168

{
  "events": [
    {
      "title": "Event 1",
      "start": "2020-11-24T09:00:00",
      "end": "2020-11-24T10:00:00"
    },
    {
      "title": "Event 2",
      "start": "2020-11-02T14:00:00",
      "end": "2020-11-02T15:00:00"
    }
  ]
}
 

[2]

 <head>
    <meta charset='utf-8' />
    <link href='js/fullcal/main.css' rel='stylesheet' />
    <script src='js/fullcal/main.js'></script>
    <script>

      document.addEventListener('DOMContentLoaded', function() {
        var calendarEl = document.getElementById('calendar');
          var calendar = new FullCalendar.Calendar(calendarEl, {
              initialView: 'listMonth',
             events: 'data/index',
            
            locale: 'de'
        });
        calendar.render();
      });

    </script>
</head>
<body>
    <div id='calendar'></div>
</body>
 

Ответ №1:

Данные события JSON, возвращаемые сервером, должны быть просто массивом, без внешней оболочки объекта — FullCalendar не знает, где внутри вашего объекта искать необходимый ему массив. Вы должны предоставить массив напрямую.

Используя ваши примерные данные, ответ JSON с вашего сервера должен быть таким:

 [
    {
      "title": "Event 1",
      "start": "2020-11-24T09:00:00",
      "end": "2020-11-24T10:00:00"
    },
    {
      "title": "Event 2",
      "start": "2020-11-02T14:00:00",
      "end": "2020-11-02T15:00:00"
    }
]