今日の日付よりも前の日付でフルカレンダーで外部イベントを削除しないようにする

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... 

ユーザーが追加したを削除するには「removeEvents」を使用することができます

Answer 2

From the documentation：

外部イベントがカレンダーに着地するときeventDropが呼び出されません。代わりにeventReceiveが呼び出されます

と言われていますが、ドロップを防止するためには、チェーンに戻っていく必要があります。あなたは "dropAccept"を使う必要があります。 You can read about it in the documentation。

Answer 3

をOUイベントを追加または更新しようとしたとき、私は警告を追加することができますどのような方法がありますイベント。

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 
    } 
}