FullCalendar edit resource on click

Question

So I'm using the Scheduler plugins from FullCalendar library version 3. I already have my event system working, letting me edit events on click via a modal box.

Now I would like to do the same with resources but I'm hitting a wall there.

Among other things, I tried this

resourceRender: function(resource, cellEls) {
    cellEls.on('click', function(resource) {
        $.getScript(resource.edit_url);
    })
}

But I can't access resource inside cellEls method.

I did not find any example of this so I'm not even sure it's possible.

Any ideas ? Thanks in advance

Answer 1

The first argument to any "click" callback is the JavaScript event object. You can't change that.

Simply allow the "resource" object to propagate down into the event handler naturally instead of trying to re-declare it:

resourceRender: function(resource, labelTds, bodyTds) {
    labelTds.on('click', function(event) {
        console.log(resource);
        $.getScript(resource.edit_url);
    });
}

Answer 2

This post is already outdated. This has since changed in version Full Calendar Resource Timeline Schedular version 4.0. I used an 'addEventListener' to the DOM object 'el' See the below snippet calling 'resourceRender' so you can see how to access this for a click event on the resource cell after render completes.

    document.addEventListener('DOMContentLoaded', function () {
   var calendarEl = document.getElementById('calendar');
   var calendar = new FullCalendar.Calendar(calendarEl, {
        schedulerLicenseKey: '<hidden>',
        plugins: ['interaction', 'resourceTimeline'],
        resourceLabelText: 'Resources',
        resources: "<see fullcalendar support docs>",
        events: "<see fullcalendar support docs>",
        resourceRender: function (renderInfo) {
           renderInfo.el.addEventListener("click", function(){ console.log('clicked:' + renderInfo.resource.id); });
        }
    });
         calendar.render();
});