FullCalendar のカスタマイズ

カレンダーを作成するのに便利なjQueryのプラグイン「FullCalendar」を使用する際に行ったカスタマイズのメモ書きです。
FullCalendar

DEMO
before
after

使用したのは、fullcalendarのver 1.5.3です。

ラベルの変更

 

時刻の表記を変更(Month-view)



 

時刻の表記を変更(Week-view, Day-view)

timeFormatで指定できる書式は、1554行目辺りに記述があるのでそこを参照

 

 

ダブルクリックを取得できるようにする

 

使い方

カレンダーのイベントをダブルクリックした際に処理を実行させることができる。

 

 

イベントをJSONで読み込む
全イベントデータを一気に読み込むのであれば、eventsにイベントデータの(json形式)のファイル名を指定すればいいだけ。
(詳しくは、demosの中のjson.htmlを参照)

でも、上記の方法ではイベントデータが1年分/2年分と増えていくと重くなる。
なのでviewの切り替わり時に必要なイベントデータだけ取得するようにする。

json-events.phpでは、受け取ったstart,endの値をつかって必要なデータだけをjsonで出力するようにしておく。

その他のFllCalendarの記事