2015-01-12 79 views
4

我有这个功能,将为给定的元素id设置日期选择器,我试图添加一个点击功能prev和下一个按钮。但似乎没有任何工作。我已经搜索过网页,为这些按钮添加点击事件,但他们都提供了一个ID。jquery datepicker添加点击事件prev next button

我在做什么错在这里?

function setDatepicker(element,curdate,identifier){ 
    //identifier is the element.id 
    var minDateMaxDate = getCalendarsYearRange(1); 
    var min = new Date(minDateMaxDate[0] * 1000); 
    var max = new Date(minDateMaxDate[1] * 1000); 

    $(element).datepicker({ 
      id: identifier,     
      firstDay: 1, 
      showOtherMonths: false, 
      selectOtherMonths: false, 
      changeYear: true, 
      changeMonth: true, 
      yearRange: getCalendarsYearRange(0), 
      monthNamesShort:monthNamesShort, 
      dayNamesShort:dayNamesShort, 
      minDate: min, 
      maxDate: max, 
      onClose: function (dateText, inst){ 
      saveFieldsChanges(element,dateText,inst); 
      getFieldsFromDialog(); 
      } 
    }); 

    $(element).datepicker("option", "dateFormat", "dd-mm-yy"); 
    $(element).datepicker("option", "defaultDate", curdate); 
    $("#"+identifier+" .ui-datepicker-div .ui-datepicker-header .ui-datepicker-prev").live('click', function(){  
     console.log("prev"); 
    }); 
    $("#"+identifier+" .ui-datepicker-div .ui-datepicker-header .ui-datepicker-next").live('click', function(){  
     console.log("next"); 
    }); 

} 

更新

的Html其中i设定日期选择器,这是在加载XSL模板的一部分,输入字段是datepickers。

<div class="ferias-form-div"> 

     <div class="labelfieldcontainer"> 
      <div class="formlabels">Data início</div> 
      <div class="formfields"> 
       <input type="text" id="datainicioferias" onblur="saveFieldsChanges(this)" onkeyup="saveFieldsChanges(this)" name="datainicioferias" value="" class="textbox"/> 
       <div class="errodialog" id="datainiciodialogferias"></div> 
      </div> 
     </div> 


     <div class="labelfieldcontainer"> 
      <div class="formlabels">Data fim</div> 
      <div class="formfields"> 
       <input type="text" id="datafinalferias" onblur="saveFieldsChanges(this)" onkeyup="saveFieldsChanges(this)" name="datafinalferias" value="" class="textbox"/> 
       <div class="errodialog" id="datafimdialogferias"></div> 
      </div> 
     </div> 
... 

我这是怎么设置例如日期选择:

setDatepicker(inputelement,curdate,"datafinalferias"); 

更新2 - 随着answear

具有利于从亚历山大我加入这个选项日历

onChangeMonthYear: function (year, month, inst) { 

      var limites; 
      var cal_date_string = month+'/'+year;   
      limites = getCalendarsYearRange(2); //my calendar's navigation limits 
      var end_date_string = limites[1]; //my calendar's navigation limits 
      var start_date_string = limites[0]; //my calendar's navigation limits 

      if(end_date_string == cal_date_string){   
       setTimeout(function(){ $(".ui-datepicker-next").attr("onclick", 'mensagemLimite(1);')},100); 
      } 

      if(start_date_string == cal_date_string){ 
       setTimeout(function(){ $(".ui-datepicker-prev").attr("onclick", 'mensagemLimite(0);')},100); 
      } 

      } 

这样当prev/next按钮变为不活动状态时,它将获得我想要的onclick函数。

回答

11

试试这个

$(document).on('click', '.ui-datepicker-next', function() { 
    console.log('next'); 
}) 

$(document).on('click', '.ui-datepicker-prev', function() { 
    console.log('prev'); 
})