将数据传递给 FullCalendar 中的后台事件对象

Question

有没有办法在用户点击后台事件时获取我传递给 eventObj 的数据？我的示例背景事件如下所示：

{
 id: 'availableForMeeting',
 title: 'Test Background Event #1',
 start: '2015-08-13T07:30:00',
 end: '2015-08-13T12:30:00',
 rendering: 'background',
 sampleId: 214,
 color: 'red'
}

但是我无法获取 sampleId 字段，因为它在 jsEvent 中不存在。

Answer 1

首先，为了实际获得后台事件的点击处理程序，您必须使用委托 jquery .on() because FullCalendar's eventClick 不适用于后台事件。

$("#calendar").on("click",".fc-bgevent",function(event){
    console.log($(this).data());
});

仅此而已，您将获得一个空的控制台日志。我们需要将事件数据添加到事件元素。我们可以在 eventRender

eventRender: function(event,element,view){
    $(element).data(event);
},

工作JSFiddle

Answer 2

已接受的答案对我不起作用，因为由于多个问题（z-index、height）我无法触发点击。我想我找到了一个更清洁的解决方案。

解决方法是使用fullcalendarclientEvents方法。它将使用 events 的客户端副本。所以没有额外的 api 调用。

select 和 dayClick 都会在选择日期时触发。因此，请选择最适合您需求的一款。我认为 select 是一个不错的选择，因为如果需要，它也会在多天的选择中被解雇。

    select: function (startDate, endDate, jsEvent, view, resource) {

       //below code for passing events in bg events of fullcalender
                          var events = $('#calendar').fullCalendar('clientEvents', function (evt) {
                        //if same date as clicked date add element to events array
                          return evt.start.isSame(startDate);//must return boolean
                    });



                    console.log(events);
}

希望这对某人有所帮助。

将数据传递给 FullCalendar 中的后台事件对象

Passing data to background event object in FullCalendar

jquery

jquery-plugins

fullcalendar

angularjs