2017-11-20 80 views
0

私は毎日3つのセクションで私の議題を生成するためにFullCalendarを使用します。私はそこのような属性groupByDateAndResourceとリソースを追加します。FullCalendar.jsで日付とリソースをグループ化する方法

$('#calendar').fullCalendar({ 
    header: { 
     left: 'prev,next', 
     center: 'title', 
     right: 'agendaWeek,agendaDayTrucks' 
    }, 
    views: { 
     agendaDayTrucks: { 
      type: 'agenda', 
      duration: { day: 1 }, 
      buttonText: 'Truck View Per Day' 
     } 
    }, 
    buttonText: { 
     week: 'Week View' 
    }, 
    nowIndicator: true, 
    defaultView: 'agendaWeek', 
    defaultDate: moment().format('YYYY-MM-DD'), 
    slotDuration: '01:00:00', 
    snapDuration: '00:05:00', 
    groupByDateAndResource: true, 
    resources: [ 
     { id: 'truck1', title: 'Truck 1' }, 
     { id: 'truck2', title: 'Truck 2' }, 
     { id: 'truck3', title: 'Truck 3' } 
    ] 
    ... 
}); 

私のカレンダーは完全に表示されますが、私の列は3つのセクションに分かれていません。 See image

どのようにFullCalendar.jsのセクションですべての日を分割することができますか?

ありがとうございます!

SOLUTION:

私はextension scheduler.jsをインストールしました。 FullCalenderのこの拡張機能は、私が望むのとまったく同じように私のすべてのリソースを表示します。

+0

、FullCalendarは、ヘッダとボディ用のテーブルを作成したので、各セルは「TD」で、あなた自身でサブセルに分割する必要があります。 – Shaybi

答えて

0

これはヘッダーにあり、本文ではセルをもう一度分割する必要があります。あなたがあなた自身のことでセルを分割する必要が

enter image description here

+0

FullCalendar.jsはライブラリであり、内部で生成されています。私は彼がどのように動作するのかわからない場合、どのように私は細胞を分割することができますか? –

+0

javaScript/jQueryを使用すると、ライブラリ関数をオーバーライドして、必要に応じて再生できます。 – Shaybi

関連する問題