不要讓用戶選擇過去的日期？

Question

是否有可能阻止用戶在使用引導日期選擇器時選擇過去的日期？

我試過使用.datepicker({ minDate: 0 })，但它似乎沒有工作。

.done(function (response) { 
         view.data = response; 
         $pageHeader.after(view.options.template(response)); 
         view.$('.datepicker:not([readonly])') 
          .datepicker({ minDate: 0}) 
          .on('changeDate', function() { 
           $(this).datepicker('hide'); 
          }); 

Answer 1

的minDate不是引導日期選擇一個選項，但你很可能覆蓋日期選擇器：

$.fn.datepicker.prototype.click: function(e) { 
    e.stopPropagation(); 
    e.preventDefault(); 
    var target = $(e.target).closest('span, td, th'); 
    if (target.length == 1) { 
    switch(target[0].nodeName.toLowerCase()) { 
     case 'th': 
     switch(target[0].className) { 
      case 'switch': 
      this.showMode(1); 
      break; 
      case 'prev': 
      case 'next': 
      this.viewDate['set'+DPGlobal.modes[this.viewMode].navFnc].call(
       this.viewDate, 
       this.viewDate['get'+DPGlobal.modes[this.viewMode].navFnc].call(this.viewDate) + 
       DPGlobal.modes[this.viewMode].navStep * (target[0].className == 'prev' ? -1 : 1) 
      ); 
      this.fill(); 
      break; 
     } 
     break; 
     case 'span': 
     if (target.is('.month')) { 
      var month = target.parent().find('span').index(target); 
      this.viewDate.setMonth(month); 
     } else { 
      var year = parseInt(target.text(), 10)||0; 
      this.viewDate.setFullYear(year); 
     } 
     this.showMode(-1); 
     this.fill(); 
     break; 
     //================= 
     // Here is where a date is selected 
     //================= 
     case 'td': 
     if (target.is('.day')){ 
      var day = parseInt(target.text(), 10)||1; 
      var month = this.viewDate.getMonth(); 
      if (target.is('.old')) { 
      month -= 1; 
      } else if (target.is('.new')) { 
      month += 1; 
      } 
      var year = this.viewDate.getFullYear(); 

      // Change some stuff here 
      date = new Date(year, month, day,0,0,0,0); 
      if(date >= this.options.minDate) { 
      this.date = date 
      this.viewDate = new Date(year, month, day,0,0,0,0); 
      this.fill(); 
      this.setValue(); 
      } else { 
      // what should we do if the date is less than minDate? 
      } 

      this.element.trigger({ 
      type: 'changeDate', 
      date: this.date 
      }); 
     } 
     break; 
    } 
    } 
}; 

OR另一種選擇是讓回調處理：

$.fn.datepicker.prototype.click: function(e) { 
    e.stopPropagation(); 
    e.preventDefault(); 
    var target = $(e.target).closest('span, td, th'); 
    if (target.length == 1) { 
    switch(target[0].nodeName.toLowerCase()) { 
     case 'th': 
     switch(target[0].className) { 
      case 'switch': 
      this.showMode(1); 
      break; 
      case 'prev': 
      case 'next': 
      this.viewDate['set'+DPGlobal.modes[this.viewMode].navFnc].call(
       this.viewDate, 
       this.viewDate['get'+DPGlobal.modes[this.viewMode].navFnc].call(this.viewDate) + 
       DPGlobal.modes[this.viewMode].navStep * (target[0].className == 'prev' ? -1 : 1) 
      ); 
      this.fill(); 
      break; 
     } 
     break; 
     case 'span': 
     if (target.is('.month')) { 
      var month = target.parent().find('span').index(target); 
      this.viewDate.setMonth(month); 
     } else { 
      var year = parseInt(target.text(), 10)||0; 
      this.viewDate.setFullYear(year); 
     } 
     this.showMode(-1); 
     this.fill(); 
     break; 
     //================= 
     // Here is where a date is selected 
     //================= 
     case 'td': 
     if (target.is('.day')){ 
      var day = parseInt(target.text(), 10)||1; 
      var month = this.viewDate.getMonth(); 
      if (target.is('.old')) { 
      month -= 1; 
      } else if (target.is('.new')) { 
      month += 1; 
      } 
      var year = this.viewDate.getFullYear(); 
      // SAVE THE OLD DATE 
      oldDate = this.date 
      this.date = new Date(year, month, day,0,0,0,0); 
      this.viewDate = new Date(year, month, day,0,0,0,0); 
      this.fill(); 
      this.setValue(); 
      this.element.trigger({ 
      type: 'changeDate', 
      date: this.date, 
      // pass it into the event object 
      oldDate: oldDate 
      }); 
     } 
     break; 
    } 
    } 
}; 

RESOURCES

• http://www.eyecon.ro/bootstrap-datepicker/

Answer 2

使用此叉從引導日期選擇器 https://github.com/eternicode/bootstrap-datepicker

，並把一些簡單的邏輯來更新結束日期的開始日期時開始日期更改

$('#start_date').datepicker().on('changeDate', function(ev){ 
    $('#end_date').datepicker('setStartDate', ev.date); 
});