предотвратить сброс JPuery datepicker после события onSelect - PullRequest
Новая
       5

предотвратить сброс JPuery datepicker после события onSelect

0 голосов
/ 08 апреля 2011

Я не знаю, как это называется, я думаю, что-то вроде сброса ..

Дело так: Я использую встроенный указатель даты, а затем добавляю новый класс с собственным стилем (css) к какой-либо дате в указателе даты. Ниже приведен код: 

$("#calendar").datepicker({ 
                            showOtherMonths: true, 
                            onSelect:function(){
                                                alert($(this).val());
                                                }
                            });
$(document).ready(function(){
    customDate();
});                         
function customDate(){
    $("#calendar a:eq(10)").addClass("has_event");
}
Код

, приведенный выше, добавит новый класс в 10-й элемент индекса 'a', и стиль для этого класса: 

.has_event{
    color:#bb0000 !important;
    font-weight:bold !important;
    background:#cccccc !important;
}

Сначала функция customDate () работает хорошо, но после выбора средства выбора даты стиль сбрасывается до значения по умолчанию, поскольку добавленный новый класс пропал.

Значит, кто-нибудь знает, как предотвратить сброс средства выбора даты после выбранного или даже после события onSelect?

@S.M.09 вот что я сделал: 

_selectDay:function(id,month,year,td){var target=$(id);if($(td).hasClass(this._unselectableClass)||this._isDisabledDatepicker(target[0])){return}var inst=this._getInst(target[0]);inst.selectedDay=inst.currentDay=$("a",td).html();inst.selectedMonth=inst.currentMonth=month;inst.selectedYear=inst.currentYear=year;if(inst.stayOpen){inst.endDay=inst.endMonth=inst.endYear=null}this._selectDate(id,this._formatDate(inst,inst.currentDay,inst.currentMonth,inst.currentYear));if(inst.stayOpen){inst.rangeStart=this._daylightSavingAdjust(new Date(inst.currentYear,inst.currentMonth,inst.currentDay));this._updateDatepicker(inst)} if(id=="#calendar"){$("#calendar a:eq(10)").addClass("has_event");}}

Ответы [ 2 ]

0 голосов
/ 08 апреля 2011

Обычно вы хотите, чтобы некоторые дни были оформлены по-другому, вы можете поместить их в массив (, чтобы быть постоянными и динамическими ) 

var myDates = [9,13];

и используйте событие beforeShowDay docs для проверки каждого дня, отображаемого вашим массивом 

 beforeShowDay:function(date) {
                      var thisDay = date.getDate();

                      return [1,((myDates.indexOf(thisDay))>-1)?'has_event':''];
                    }

это относится к td, поэтому вам нужно изменить свой CSS на .has_event a{..

демо: http://jsfiddle.net/gaby/dTRNf/

0 голосов
/ 08 апреля 2011

В jQuery js (jquery-ui-x.x.x.custom.min.js) ... вы найдете функцию с четырьмя аргументами (имена переменных могут отличаться в зависимости от версии) под названием 

_selectDay:function(a,b,c,d)

добавить код перед концом функции 

if(a=="#calendar"){
$("#calendar a:eq(10)").addClass("has_event");
}

удалите if condition, если вы хотите его глобально ... код выше будет применять его только к календарю, который вы хотите

EDIT 

_selectDay:function(a,b,c,e){
    var f=d(a);
    if(!(d(e).hasClass(this._unselectableClass)||this._isDisabledDatepicker(f[0]))){
        f=this._getInst(f[0]);
        f.selectedDay=f.currentDay=d("a",e).html();
        f.selectedMonth=f.currentMonth=b;
        f.selectedYear=f.currentYear=c;
        this._selectDate(a,this._formatDate(f,f.currentDay,f.currentMonth,f.currentYear))
        }
    if(a=="#calendar"){
    $("#calendar a:eq(10)").addClass("has_event");
    }


},
...