在完整日历中相互共享的事件

Question

我已经在全日历中创建了一个应用程序，该应用程序运行良好，但问题是在周视图下我今天（2014 年 11 月 9 日至 15 日）有两个活动——会议 1 和会议 2，两者都是在您可以看到浅绿色事件的边界级别内。我面临的问题是事件共享通过拖放分配给它们的时间，如下所示。因为我的要求是任何事件都不应与任何其他事件共享时间

谁能告诉我一些解决方法

Working JSfiddle

我的代码如下所示

$(document).ready(function() {
        $('#calendar').fullCalendar({
           slotEventOverlap : false,
            header: {
                left: 'prev,next today',
                center: 'title',
                right: 'month,agendaWeek,agendaDay'
            },
            defaultDate: '2014-11-12',
            businessHours: true, // display business hours
            editable: true,
            events: [
                {
                    title: 'Business Lunch',
                    start: '2014-11-03T13:00:00',
                    constraint: 'businessHours'
                },
                {
                    title: 'Meeting 1',
                    start: '2014-11-13T11:00:00',
                    end: '2014-11-13T12:00:00',

                    constraint: 'availableForMeeting', // defined below
                    color: '#257e4a'
                },
                {
                    title: 'Meeting 2',
                    start: '2014-11-13T12:00:00',
                    end: '2014-11-13T14:00:00',
                    constraint: 'availableForMeeting', // defined below
                    color: '#257e4a'
                },
                {
                    title: 'Conference',
                    start: '2014-11-18',
                    end: '2014-11-20'
                },
                {
                    title: 'Party',
                    start: '2014-11-29T20:00:00'
                },

                // areas where "Meeting" must be dropped
                {
                    id: 'availableForMeeting',
                    start: '2014-11-11T10:00:00',
                    end: '2014-11-11T16:00:00',
                    rendering: 'background'
                },
                {
                    id: 'availableForMeeting',
                    start: '2014-11-13T10:00:00',
                    end: '2014-11-13T16:00:00',
                    rendering: 'background'
                },

                // red areas where no events can be dropped
                {
                    start: '2014-11-24',
                    end: '2014-11-28',
                    overlap: false,
                    rendering: 'background',
                    color: '#ff9f89'
                },
                {
                    start: '2014-11-06',
                    end: '2014-11-08',
                    overlap: false,
                    rendering: 'background',
                    color: '#ff9f89'
                }
            ],
             eventDrop: function (event, delta, revertFunc) {
                return false;
            }
        });
});

Answer 1

如果你需要类似的东西：

disableDragging: true,

-事情对你来说很容易。但这是一个 fullCalendar 方法，它禁用了整个日历的事件拖动能力。

所以（而不是尝试使用不存在的函数）在你的 eventRender(event, element) 回调中试试这个：

if (event.id == 'someid')
    element.draggable = false;
}

我在这里找到了另一个解决方案：

为什么不在Select回调中检查呢？

select: function( start, end, allDay, jsEvent, view ) {
    if( /*start is the disabled time*/ )
        return false;
    else{
        // Proceed with the normal flow of your application
        // You might show a popup to get info from user to create
        // a new event here
    }
}

参考：Disable timeslot ranges in jQuery fullcalendar plugin

谢谢。