2011-12-29 34 views
0

我正在使用dojo 1.6並在項目中使用dijit.calendar,除了着色選定網格單元的目標外,它工作良好。我有三個由日曆點擊操縱的innerHTML。那裏沒問題。自定義着色dijit.calendar中的gridcell並保持其持久

dijit.calendar的行爲是在單擊時突出顯示一個網格單元格(日曆日)爲藍色,並單擊另一個網格單元格時,它將變爲藍色。 我想要做的就是在單擊單元格時將單元格着色爲自定義顏色並使其保持不變。

具體來說,該日曆適用於具有官方日期(藍色),開始日期(綠色)和結束日期(紅色)的項目。

我甚至沒有意識到有一種方法可以爲dijit.calendar中的特定網格單元着色。有沒有人成功地完成了這項工作,或者有一個指針讓我朝着正確的方向發展?下面

編輯:..

好鄉親,我有哪裏與此感謝以下菲利普去一個不錯的領先優勢。菲利普的解決方案將按照預期將該單元完全着色(所以他得到了答案業力)。原來,如果選定的網格單元格爲紅色,並且切換到月份以選擇後續日期,則單元格會保持紅色。

我大部分都想通了。例如,我可以得到成功着色的第一對日期,但如果我必須在下個月進行第三次日期並更改日曆等操作,則單元格將保持着色。所以必須有一種方法可以將我的顏色更改更改爲與實際日期相對應的不同值。

我知道的onChange的唯一參數返回的是日期本身這樣的(在Firebug使用debug.console).....

[Date {Wed Jan 18 2012 00:00:00 GMT-0500 (EST)}] 

我通過Firebug的檢查代碼,並在同一注意到細胞,代碼看起來像這樣....

<td role="gridcell" class="dijitCalendarSelectedDate dijitCalendarCurrentMonth dijitCalendarDateTemplate" dijitdatevalue="1326866400000" style="background-color: green;" tabindex="0"><span class="dijitCalendarDateLabel">18</span></td> 

這個不同的值似乎是「dijitdatevalue」。

我想我可以遵循的鏈條......

上點擊,保存在一個隱藏字段的第一次約會「dijitdatevalue」(以及第二和第三日期) 然後返回並將相應dijitdatevalue的背景顏色設置爲藍色,綠色或紅色。

現在的問題是如何將dijitdatevalue字符串返回到隱藏字段。當我找出答案時,我會再次更新這篇文章。

珍妮

回答

2

如果你看一下部件代碼,您將看到名爲_onDayMouseDown私有方法,它是負責將細胞藍... 您可以通過dojo.connect添加自定義代碼,該函數,像這樣:

dojo.connect(dijit.byId('calendar1'), "_onDayMouseDown", function(/*Event*/ evt){ 
    var node = evt.target.parentNode; 
    dojo.style(node, "backgroundColor", "green"); 
}); 

否則,如果你使用Dojo 1.7,你可以給一個嘗試到MultiSelectCalendar

+0

感謝菲利普。我編輯了我的帖子以包含其他信息。你死了。看起來,我將不得不將顏色綁定到不同的日期id(dijitdatevalue)而不是gridcell,因爲當您更改月份時,gridcell保持相同的顏色。看起來我必須想出更有活力的東西。 – 2012-01-03 20:43:36