Question

我正在使用fullcalendar jquery插件来创建事件计划。我想阻止用户在日历上删除外部事件（如果它早于当前日期）。这是我目前的代码：

$('#edit_calendar').fullCalendar({
    header:
    {
        left: 'prev,next today',
        center: 'title',
        right: 'month,agendaWeek,agendaDay'
    },
    titleFormat: { month: 'MMMM' },
    defaultView: 'month',
    droppable: true,
        drop: function (date, jsEvent, ui, resourceId) {
            //compare today's date with drop date - if in the past, don't allow
            var today = moment().startOf('day');
            var dropDate = moment(date).startOf('day');
            if (dropDate < today)
            {
                //The alert is shown
                alert("An event in the past cannot be added, updated, or deleted.");
                return false;
            }
            else
            {              
                var memberName = $(this).data('event').title;
                var memberID = $(this).attr('id').toString();          
                //Create Event - add to array
                var newEvent = new Object();
                newEvent = {
                    title: memberName,
                    id: memberID,
                    start: date.format(),
                    end: date.format(),
                    objectID: 0
                };
                eventsAdded.push(newEvent);
            }
        },
        ...rest of code

如果事件在当天之前被删除，则显示警报并且不创建事件。如果在当天之后显示，请创建活动。

在上面的代码中，会显示警报，但仍会创建事件。如果在当天之后删除事件，则会创建事件。

我想通过在显示警报后添加return false来防止事件被创建。但是，会显示警报并创建事件。

我是否必须删除该事件，或者是否有办法阻止创建该事件？

Answer 1

分别使用selectConstraint和eventConstraint添加或更改事件时，我能够限制事件。但是，我想在用户尝试在开始日期和结束日期之外更新或添加事件时添加警报，以便他们知道为什么它不起作用。

这就是我所拥有的：

$('#edit_calendar').fullCalendar({
    header:
    {
        left: 'prev,next today',
        center: 'title',
        right: 'month,agendaWeek,agendaDay'
    },
    titleFormat: { month: 'MMMM' },
    defaultView: 'month',
    droppable: true,
        drop: function (date, jsEvent, ui, resourceId) {     
            var memberName = $(this).data('event').title;
            var memberID = $(this).attr('id').toString();          
            //Create Event - add to array
            var newEvent = new Object();
            newEvent = {
                title: memberName,
                id: memberID,
                start: date.format(),
                end: date.format(),
                objectID: 0
            };
            eventsAdded.push(newEvent);     
        },
        editable: true,
            //The following constraints prevents the user from adding/updating/deleting events that are before the current date
            //The end date is required.  So, you can't add events over a year away from the current date
            eventConstraint: {
                start: moment().startOf('day'),
                end: moment(moment().startOf('day'), 'MM-DD-YYY').add('days', 365)
            },
            selectConstraint: {
                start: moment().startOf('day'),
                end: moment(moment().startOf('day'), 'MM-DD-YYY').add('days', 365)
            },
            ...rest of code...

当用户尝试添加或更新事件时，我是否可以添加警报

Answer 2

From the documentation：

当外部事件落在日历上时，不会调用eventDrop。而是调用eventReceive

话虽如此，为了防止跌落，你需要更多地回到链中。你需要使用“dropAccept”。 You can read about it in the documentation

Answer 3

您可以使用＆＃39; removeEvents＆＃39;删除添加的事件。

https://fullcalendar.io/docs1/event_data/removeEvents/

drop: function(date, jsEvent, ui, resourceId) {

     var add = true;

     ... // Here decide whether to add or not


     if(add){

          ;   
     }
     else{

          //use 'removeEvents' to remove added event
     }
}

如果早于今天的日期，则阻止外部事件在完整日历上被删除

3 个答案: