Неправильное поведение при загрузке 2 источников событий JSON (один должен быть фоновым)

Question

Я получаю ошибочное поведение событий, когда загружаю два eventSources, и одно из них определяется с помощью рендеринга: background.

Сгенерированные JSON верны, поскольку при определении двух eventSources при обычном рендеринге все работает правильно.

Указанное поведение включает в себя следующие симптомы:

• Некоторые события, которые не отображаются (они всегда исчезают из календаря , которые не являются фоновыми и не отображаются в DOM)

• Фоновые события, которые появляются как обычные события

• При каждом нажатии предыдущего / следующего поведение может отличаться.

Это мой код для загрузки событий:

$('#workshifts_ocupations_calendar').fullCalendar({
  defaultView: 'agendaWeek',
  eventSources: [
    {
      id: "workshiftSource", 
      url: '<?= base_url(); ?>turno/ajax_load_workshifts_by_installation/'+installation,
      editable:true,
      success: function(){
        console.log("turnos");
      }
    },
    {
      id: "backSource",
      url: '<?= base_url(); ?>ocupacion/ajax_load_ocupations_by_installation/'+installation,
      rendering: 'background',
      editable:false,
      success: function(){
        console.log("fondos");
      }
    }
  ],
  eventRender: function(event, element) {
    // Si es background - Mostramos el título.
    if(event.source.rendering == "background"){
      element.html('<span class="backgroundEventsTitle">' + event.title + "</span>");
    }
  },
  locale: 'es',
  themeSystem: 'bootstrap3',
  minTime: '07:00:00',
  maxTime: '23:00:00',
  slotDuration: '00:15:00',
  slotLabelInterval: '00:30:00',
  slotLabelFormat: 'H:mm',
  selectable: true,
  allDaySlot: false,
  selectConstraint:{
    start: '07:00',
    end: '23:00',
  },
  eventConstraint:{
    start: '07:00',
    end: '23:00',
  },
  header: {
    left: 'prev,next today',
    center: 'title',
    right: 'month,agendaWeek,agendaDay'
  }

});

Сюда прилагаются скриншоты ошибок, производится нажатием кнопки Далее и предварительного просмотра (без перезагрузки страницы).

поведение 1

поведение 2

Повтор : если я использую обычный рендеринг в обоих источниках событий, эта проблема не возникает.

Заранее спасибо.

--- РЕДАКТИРОВАТЬ ---

FullCalendar v3.9.0

Вот фон JSON

Вот обычные события JSON

Спасибо!

Answer 1

Хорошо, я нашел это.

У вас конфликт идентификаторов в двух ваших источниках данных. В ваших «обычных» (не фоновых) данных у вас есть 5 событий с идентификаторами от 1 до 5. В «фоновом» источнике у вас также есть 4 события с идентификаторами от 2 до 5. Они конфликтуют с идентификаторами в другом источнике данных. Похоже, что это вызывает путаницу в fullCalendar и предполагает, что они связаны с событиями в «обычном» источнике данных с тем же идентификатором, и, следовательно, кажется, что они не могут быть отображены как фоновые события.

Является ли это ошибкой в ​​fullCalendar, я не совсем уверен - вам нужно спросить программистов, каково их намерение. Конечно, в fullCalendar возможно иметь несколько событий с одним и тем же идентификатором, и есть несколько сценариев, где это полезно.

Однако, если, как и в вашем случае, события совершенно не связаны, вероятно, не стоит давать им одинаковые идентификаторы. Как только вы меняете идентификаторы, проблема исчезает:

Пример измененных фоновых событий:

{
    "id": "2000",
    "title": "At. Balearicus (perpe lui)",
    "backgroundColor": "#FF40D1",
    "borderColor": "#eb2cbd",
    "start": "2018-08-20 09:00:00",
    "end": "2018-08-20 10:00:00"
},
{
    "id": "3000",
    "title": "At. Balearicus (perpe lui)",
    "backgroundColor": "#FF40D1",
    "borderColor": "#eb2cbd",
    "start": "2018-08-27 09:00:00",
    "end": "2018-08-27 10:00:00"
},
{
    "id": "40000",
    "title": "At. Balearicus (perpe lui)",
    "backgroundColor": "#FF40D1",
    "borderColor": "#eb2cbd",
    "start": "2018-09-03 09:00:00",
    "end": "2018-09-03 10:00:00"
},
{
    "id": "5000",
    "title": "At. Balearicus (perpe lui)",
    "backgroundColor": "#FF40D1",
    "borderColor": "#eb2cbd",
    "start": "2018-09-10 09:00:00",
    "end": "2018-09-10 10:00:00"
},

Рабочая демонстрация по адресу: http://jsfiddle.net/qxLuLhsf/135/