特定の曜日を選択不可にする

説明補足説明コード分割コードその他関連書籍コメント投稿

このサンプルは、カレンダーの特定の曜日（Sun）、日付(2/29)を選択できないようにしています。また、2/1～2/7の日付の背景色をカスタマイズしています。

このサンプルは、カレンダーの特定の曜日（Sun）、日付(2/29)を選択できないようにしています。また、2/1～2/7の日付の背景色をカスタマイズしています。

カレンダーの特定の曜日を選択不可にするには、addWeekdayRenderer()メソッドを使用します。特定の日付を選択不可にするには、addRenderer()メソッドを使用します。同様に日付の背景色をカスタマイズするときも、addRenderer()メソッドを使用します。 

// 日曜日を選択不可にする  
var myCustomRenderer = function(workingDate, cell) {   
    cell.innerHTML = "X";   
    YAHOO.util.Dom.addClass(cell, "sunday");   
    return YAHOO.widget.Calendar.STOP_RENDER;   
}   
YAHOO.myCalendar.cal1.addWeekdayRenderer(
  1, myCustomRenderer);   

// 2/29を選択不可にする
YAHOO.myCalendar.cal1.addRenderer(
  "2/29", 
  YAHOO.myCalendar.cal1.renderBodyCellRestricted
);   

// 2/1～2/7の背景色をカスタマイズ   
YAHOO.myCalendar.cal1.addRenderer(
  "2/1/2008-2/7/2008", 
  YAHOO.myCalendar.cal1.renderCellStyleHighlight1
);
このサンプルを実行するには、下記サイトからYahoo! UI Libraryをダウンロードする必要があります。

http://developer.yahoo.com/yui/