Как изменить цвет ячейки jquery datepicker - PullRequest
5 голосов
/ 25 мая 2010

У меня есть jquery datepicker, и мне нужно иметь возможность изменить цвет фона для выбранной даты ячейки. Я пытаюсь что-то вроде:

    $("#fecha").datepicker({ 
          onSelect: function(value, date) { 
             alert(date.css());
          } 
    });

в надежде, что параметр даты относится к выбранной ячейке, но, похоже, он не работает.

Есть предложения?

// Изменить: Решение должно позволить мне динамически устанавливать разные ячейки с разными цветами, поэтому я пытаюсь использовать onSelect вместо прямого изменения CSS.

Цель состоит в том, чтобы иметь календарь с событиями, установленными пользователем.

Заранее спасибо.

Ответы [ 4 ]

11 голосов
/ 25 мая 2010

Я думаю, что лучший способ (при условии, что я вас правильно понял) - это просто переопределить CSS.
В вашей таблице стилей сайта или в разделе заголовка HTML вам просто нужно переопределить следующий css selector

.ui-datepicker-current-day .ui-state-active { background: #000000; }

EDIT

Имея в виду ваше редактирование, должно работать следующее (при условии, что вы можете заставить указатель даты перестать обновлять)

onSelect: function(value, date) {
    date.dpDiv.find('.ui-datepicker-current-day a')
        .css('background-color', '#000000');
}
1 голос
/ 09 февраля 2014

В моем случае мне нужно удалить активный класс, поэтому:

$("#datepicker").datepicker({
  onSelect: function(dateText, inst) {
    setTimeout(function(){
      inst.dpDiv.find('.ui-datepicker-current-day a').removeClass('ui-state-active');
    }, 50);
  }
});
1 голос
/ 25 мая 2010

изменение в вашем css классе .ui-datepicker-current-day

0 голосов
/ 06 марта 2012

DatePicker по умолчанию следует вашей теме. Но вы можете переопределить что угодно.

ui-state-active - стиль выбранной даты. ui-state-highlight - это стиль, используемый для определения текущей даты.

Так что сделайте что-то вроде этого:

#ui-datepicker-div .ui-state-active {color: #FFFFCC;}

#ui-datepicker-div .ui-state-highlight {color: #DCDCDC;}

Вы можете добавить этот CSS на страницу или настроить саму тему.

...