FullCalendar не отображает события, извлеченные через JSON с динамическим параметром «extraParams» - PullRequest
0 голосов
/ 24 октября 2019

У меня проблемы с отображением событий, извлеченных через JSON, с помощью динамического параметра extraParams, как описано здесь в Документах :

var calendarEl = document.getElementById('calendar');
calendar = new FullCalendar.Calendar(calendarEl, {
...,
events: {
    url: '/getEvents',
    method: 'POST',
    extraParams: function() {
        var combobox = document.getElementById('combobox');
        var value = combobox.options[combobox.selectedIndex].value;
        return {client: value};
    },
    failure: function(error) {
        console.log(error);
        alert("Error", "Unable to fetch events", "red");
    },
},
...
});
calendar.render();

. На панели отладки я вижузапрос от FullCalendar:

XHR POST https://127.0.0.1:8443/getEvents

С этими параметрами:

client: All
start: 2019-09-30T00:00:00Z
end: 2019-11-11T00:00:00Z
timeZone: UTC

И ответ:

{
  "error": "", 
  "events": [
    {
      "allDay": 1, 
      "color": "blue", 
      "end": "2019-10-24T00:00:00.000Z", 
      "extendedProps": {
        "company": "Company 1", 
        "state": "Active", 
        "type": "task"
      }, 
      "groupId": "48", 
      "id": 27, 
      "start": "2019-10-23T00:00:00.000Z", 
      "title": "Title 1", 
      "url": ""
    }, 
    {
      "allDay": 1, 
      "color": "blue", 
      "end": "2019-11-07T00:00:00.000Z", 
      "endpoints": 0, 
      "extendedProps": {
        "company": "All", 
        "description": "Description", 
        "creationDate": "2019-11-04", 
        "state": "Active", 
        "tecnology": "test", 
        "element": "test 1", 
        "type": "type 2", 
        "user": "user 1", 
        "version": "1.2"
      }, 
      "id": 76, 
      "start": "2019-11-04T00:00:00.000Z", 
      "title": "Title 2", 
      "url": ""
    }
  ]
}

Но FullCalendar не отображает эти два полученных события,Я не знаю, что я делаю неправильно.

С уважением.

1 Ответ

1 голос
/ 24 октября 2019

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

Вам нужно просто вернуть:

[
 {
  "allDay": 1, 
  "color": "blue", 
  "end": "2019-10-24T00:00:00.000Z", 
  "extendedProps": {
    "company": "Company 1", 
    "state": "Active", 
    "type": "task"
  }, 
  "groupId": "48", 
  "id": 27, 
  "start": "2019-10-23T00:00:00.000Z", 
  "title": "Title 1", 
  "url": ""
 }, 
 {
  "allDay": 1, 
  "color": "blue", 
  "end": "2019-11-07T00:00:00.000Z", 
  "endpoints": 0, 
  "extendedProps": {
    "company": "All", 
    "description": "Description", 
    "creationDate": "2019-11-04", 
    "state": "Active", 
    "tecnology": "test", 
    "element": "test 1", 
    "type": "type 2", 
    "user": "user 1", 
    "version": "1.2"
  }, 
  "id": 76, 
  "start": "2019-11-04T00:00:00.000Z", 
  "title": "Title 2", 
  "url": ""
 }
]

с вашего сервера, без остатка.

Я должен сказать, что документация fullCalendar этого не делаетособенно ясно.

NB Я бы сказал, что свойство "ошибки" в любом случае является излишним, в любом ответе JSON. Если произошла ошибка, вы должны вернуть HTTP-код состояния, указывающий природу ошибки, и совершенно другое тело ответа, указывающее, что вы хотите сообщить пользователю об ошибке. Это вызовет обратный вызов «fail» в вашем JS и позволит браузеру ответить соответствующим образом.

...