Отображение FullCalendar HTML в заголовке события - PullRequest
Новая
       8

Отображение FullCalendar HTML в заголовке события

0 голосов
/ 30 марта 2020

Я обновляю свою полную версию календаря до V4. Я кормлю своих через JSON, и у меня есть HTML (некоторые значки FontAwsome) в названии моего мероприятия. Вот мой старый код V3 для рендеринга моих элементов: 

$(function() {
  $('#calendars').fullCalendar({
    events: '/activities/calendar.json',
    contentHeight: 750,
    displayEventTime: false,
    header: {
      left: '',
      center: 'title',
      right: 'today prev,next'
    },
    businessHours: {
      dow: [1, 2, 3, 4, 5]
    },
    handleWindowResize: true,
    eventLimit: 2,
    eventLimitClick: 'popover',
    eventRender: function(event, element) {
      element.find('.fc-title').html(event.title);
    }
  });
});

eventRender: - это то, что не получается. В новых документах неясно, как я могу конвертировать это в новую версию. С этим кодом мой календарь просто не загружается с json ошибкой разбора в консоли. Если я удаляю его, он работает, но мой HTML отображается как обычный текст. Я уверен, что упускаю что-то очевидное и простое здесь. Мой JS набор навыков не так уж велик.

1 Ответ

1 голос
/ 31 марта 2020

После некоторого спотыкания я нашел это: 

  document.addEventListener('DOMContentLoaded', function() {
    var calendarEl = document.getElementById('timeline');

    var calendar = new FullCalendar.Calendar(calendarEl, {
      events: '/activities/timeline.json',
      plugins: [ 'resourceTimeline', 'interaction' ],
      header: {
        left: 'prev,today,next',
        center: 'title',
        right: 'resourceTimelineWeek,resourceTimelineMonth,resourceTimelineYear, '
      },
      eventRender: function(info) {
        info.el.querySelectorAll('.fc-title')[0].innerHTML = info.el.querySelectorAll('.fc-title')[0].innerText;
      }
    });

    calendar.render();
  });

Я открыт для альтернативных чистых ответов.

...