Display more Text in fullcalendar

Question

I am looking for a solution to display more information in event.

For example in the DayView you see a event from 06:00 to 10:00.
I want to display a additio

Answer 1

I needed the ability to display quite a bit of info (without a tooltip) and it turned out quite nice. I used FullCalendars title prop to store all my HTML. The only thing you have to do to ensure it works after render is to parse the title fields HTML.

// `data` ismy JSON object.
$.each(data, function(index, value) {
  value.title = '
' + value.title + '
';
  value.title += '
' + value.start_time + ' - ' + value.end_time + '';
  value.title += '' + value.location + '
';
  value.title += '
LEARN MORE ';
});

// Initialize the calendar object.
calendar = new FullCalendar.Calendar(cal, {
  events: data,
  plugins: ['dayGrid'],
  eventRender: function(event) {
    // This is required to parse the HTML.
    const title = $(event.el).find('.fc-title');
    title.html(title.text());
  }
});
calendar.render();

I would have used template literals, but had to support IE11