eventRender disappears in fullcalendar v5

Question

Version : Fullcalendar-Scheduler v5 beta2

I tried eventRender like below in chrome:

document.addEventListener('DOMContentLoaded', function() {
    var calendarEl = document.getElementById('planningMix');
    var planningMix = $(calendarEl);
    var calendar = new FullCalendar.Calendar(calendarEl, {
        //...
        eventRender: function(info) {
            debugger
          },
        events: function(d, successCallback, failureCallback) {
           //...
        }
    });

    calendar.render();
});

When I run this code, "debugger" didn't fired. eventRender has became another name in V5 ?

Trejo

Answer 1

those who were going to upgrade from V4 to V5, check this document upgrading-from-v4, there were many changes which we need to consider while upgrading.

Example of EventContent

eventContent: function (arg) {

            var event = arg.event;
            
            var customHtml = '';
            
            customHtml += "<span class='r10 font-xxs font-bold' style='overflow: hidden;'>" + event.title + "</span>";
            
            customHtml += "<span class='r10 highlighted-badge font-xxs font-bold'>" + event.extendedProps.age + text + "</span>";
                          

            return { html: customHtml }
        }

Blackstone

Answer 2

You can use this :

eventClick: function (info) {
            showdata(info.event.id);
         }

I used v3 and upgrading to v5 and still working.

Farra

Answer 3

I also got the same problem when going to get events from back-end, finally found a solution.

'eventSources'

eventSources: {
              url: 'test/getEvents',
              type: 'get',
              error: function() {
                alert('there was an error while fetching events!');
              }
           }
  

PHP backend array structure is like this : Example

$events = [
      [
        'title'          => 'All Day Event',
        'start'          =>  '2022-07-26T00:00:00+05:30',
        'backgroundColor'=>  '#f56954', //red
        'borderColor'    =>  '#f56954', //red
        'allDay'         =>  true
      ],
      [
        'title'          => 'All Day Event',
        'start'          =>  '2022-07-28T00:00:00+05:30',
        'backgroundColor'=>  '#f56954', //red
        'borderColor'    =>  '#f56954', //red
        'allDay'         =>  true
      ]
   ];
   echo json_encode($events);

Barnie