Пользовательское окрашивание ячейки сетки в dijit.calendar и сохранение ее постоянной

Я использую dojo 1.6 и использую dijit.calendar в проекте, и он отлично работает, за исключением цели раскрашивания выбранной ячейки сетки. У меня есть три innerHTML, которыми манипулируют щелчки календаря. Нет проблем.

Поведение dijit.calendar заключается в выделении ячейки сетки (календарного дня) синим цветом при нажатии, а при нажатии на другую ячейку сетки она становится синей. Что я хотел бы сделать, так это раскрасить ячейку настраиваемым цветом при нажатии и сделать ее постоянной.

В частности, календарь предназначен для проекта, у которого есть официальная дата (синий цвет), дата начала (зеленый цвет) и дата окончания (красный цвет).

Я даже не знаю, есть ли способ раскрасить конкретную ячейку сетки в dijit.calendar. Кто-нибудь успешно сделал это или имеет указатель, чтобы отправить меня в правильном направлении?

Изменить ниже:..

ОК, ребята, у меня есть довольно хорошее представление о том, что делать с этим, благодаря Филиппу ниже. Решение Филиппа окрасит ячейку ТОЧНО так, как предполагалось (так что у него есть ответная карма). Оказывается, если выбранная ячейка сетки красная и я переключаюсь на месяц, чтобы выбрать последующую дату, ячейка остается красной.

Я большую часть понял. Я могу, скажем, успешно раскрасить первые пару дат, но если мне нужно сделать что-то вроде добавления третьей даты в следующем месяце и изменения календаря, ячейки останутся окрашенными. Поэтому должен быть способ изменить изменение цвета на отдельное значение, соответствующее фактической дате.

Я знаю, что единственным возвращаемым аргументом onChange является сама дата (используя debug.console в Firebug).....

[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» первой даты в скрытом поле (а также вторую и третью даты). Затем вернитесь и установите цвет фона соответствующего значения dijitdate на синий, зеленый или красный.

Теперь вопрос в том, как вернуть строку dijitdatevalue в скрытое поле. Я обновлю этот пост снова, когда выясню ответ.

Джени


dojo
person Jane Wilkie    schedule 29.12.2011    source источник

Ответы (1)


arrow_upward
2
arrow_downward

Если вы посмотрите на код виджета, вы увидите закрытый метод _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

person Philippe    schedule 30.12.2011
comment
Спасибо, Филипп. Я отредактировал свой пост выше, чтобы включить дополнительную информацию. Вы были мертвы. Похоже, что мне придется привязать свою окраску к отдельному идентификатору даты (dijitdatevalue) вместо ячейки сетки, поскольку при изменении месяцев ячейки сетки остаются одного цвета. Похоже, мне нужно придумать что-то более динамичное. - person Jane Wilkie; 04.01.2012