Fullcalendarでドラッグするときに2つのイベントをリンクするにはどうすればよいですか？

Question

私は別のイベントに接続されているイベントをドラッグ＆ドロップしようとしています。

私の質問は、同時に2つのイベントをドラッグすることができれば、ドラッグするときに同じ間隔になるようにすることです。最初のイベントは、メインイベントであると（の間に切れ目があるので）が、第2の事象は、最初のイベントからの継続的なイベントであるhttp://st.d.pr/aDoFmf

：それはこのようになります瞬間

。

fullcalendarには、このような機能が組み込まれていますか？

お待ちしております。

Answer 1

これは確かに私がこの目的のために使用したカスタムコードのビットで可能です。

relatedEventsと呼ばれる追加のフィールドを持つイベントオブジェクトを定義したとします。このフィールドは、次のように定義されています。これは、イベントが接続されているIDの配列です。あなたの場合、あなたの2つの出来事はお互いにつながっています。あなたは、余分なカスタム構造を持ってたら、イベントがドラッグされて終わった、と上にバックドロップされたときに実行eventDropコールバックの一環として、いくつかのコードを実行することができます

{ id: 1, start: '2017-10-11T11:00:00', end: '2017-10-11T13:00:00', title: 'Event 1', relatedEvents: [2, 3] } 
{ id: 2, start: '2017-10-11T15:00:00', end: '2017-10-11T17:00:00', title: 'Event 2', relatedEvents: [1, 3] } 
{ id: 3, start: '2017-10-11T19:00:00', end: '2017-10-11T21:30:00', title: 'Event 3', relatedEvents: [1, 2] } 

：ここでは3つの相互接続されたイベントと例ですカレンダー。

このコードでは、ドラッグされたイベントの関連イベントを調べ、そのイベントオブジェクトをIDに基づいてfullCalendarから取り出し、関連するイベントの開始時刻と終了時刻を、ドラッグされたイベントが変更されたのと同じ期間これはdeltaパラメータがコールバックに渡されることによって与えられます）。

eventDrop: function(event, delta, revertFunc, jsEvent, ui, view) { 
    var relatedEvents = $("#calendar").fullCalendar("clientEvents", function(evt) { 
     for (var i = 0; i < event.relatedEvents.length; i++) 
     { 
      if (evt.id == event.relatedEvents[i]) return true; 
     } 

     return false; 
    }); 

    for (var i = 0; i < relatedEvents.length; i++) 
    { 
     relatedEvents[i].start.add(delta); 
     relatedEvents[i].end.add(delta); 
    } 

    $("#calendar").fullCalendar("updateEvents", relatedEvents); 
} 

eventDropコールバックの詳細については、https://fullcalendar.io/docs/event_ui/eventDrop/を参照してください。