addDay

表示月の日付セルを追加する際に呼ばれる関数。

実行するタイミング

日付セル追加時

第一引数

日付セル(td)のjQueryオブジェクト

this.dayで日(day)を取得できます。これはtd.text()の戻り値と同じ値です。

$(expr).calendar({
	addDay: function(td) {
		// 日付の後ろに「日」を付ける (例: 10日)
		td.text(td.text() + '日');
		// 上記と下記の結果は同じ
		td.text(this.day + '日');
	}
});

addEvent

イベント(行事)を追加する際に呼ばれる関数。

実行するタイミング

イベント(行事)追加時

第一引数

日付セル(td)のjQueryオブジェクト

第二引数

eventsオプションで指定したイベント

第二引数にはeventsで指定した日付の内容がそのまま渡される。イベントを追加の例では連想配列を渡しています。

$(expr).calendar({
	// 以下は初期値
	addEvent: function(td, evt) {
		var elem = typeof evt.url != 'undefined'
			? $('<a />').attr('href', evt.url)
			: $('<span />');
		if (evt.id) {
			elem.attr('id', 'event-' + evt.id);
		}
		if (evt.title) {
			elem.attr('title', evt.title);
		}
		elem.text(td.text());
		td.text('').append(elem).addClass('event');
	}
});

beforeMove & afterMove

月移動前後に呼ばれる関数。

実行するタイミング

月移動前後

第一引数

全オプションの連想配列

第二引数

移動する年

第三引数

移動する月

$(expr).calendar({
	// 月移動前に次のイベントをセット
	beforeMove: function(option, year, month) {
		// /hoge/YYYYMM からJSONを取得
		$.getJson('/hoge/' + year + month, function(json) {
			option.events = json;
		});
	}
});

preloadEventがあるので使用用途が微妙。

使用方法

オプションpreloadEventに関数を定義して、以下のようにイベントデータをreturnして下さい。

$(expr).calendar({
	preloadEvent: function(year, month) {
		// 表示月が2009年10月の場合
		:
		: AjaxでJSONを読み込むなど
		:
		return {
			'2009-09-1': {
				title: '前月のイベント'
			},
			'2009-11-1': {
				title: '次月のイベント'
			}
		}
	}
});

この場合、前月と次月のイベントを含むデータをreturnしなければなりません。

イベントデータが多い場合は、前月と次月を分けて記述することも出来ます。

$(expr).calendar({
	preloadEvent: function(year, month) {
		// 表示月が2009年10月の場合
		:
		: AjaxでJSONを読み込むなど
		:
		return {
			// 前月のデータはprevの中に
			prev: {
				'2009-09-1': {
					title: '前月のイベント'
				}
			},
			// 次月のデータはnextの中に
			next: {
				'2009-11-1': {
					title: '次月のイベント'
				}
			}
		}
	}
});

イベント追加の処理が少なくなるので、少しだけ速くなります。