如何在jquery UI日期選擇器中動態設置最小和最大日期

Question

我已經從日期和日期在我的網頁中放置了兩個datepikcer來生成報告。我想在兩個日期選擇器上應用驗證來選擇日期。我已經爲兩個datepikcer設置了最小和最大日期編寫了常見的jquery代碼，但它不適用於我。我還在datepicker關閉時編寫了設置最小和最大日期的代碼。

我的要求是，我想在datepicker初始化時動態設置最小和最大日期。然後之後還設置另一個最大和最小日期時，用戶可以從任何日期選擇器選擇日期

$("#frm_date").datepicker({ 
showOn: 'button', 
buttonImage: 'images/calendar.gif', 
buttonImageOnly: true, 
dateFormat:'yy-mm-dd', 
onClose: function(selectedDate) { 
          $("#to_date").datepicker("option", "minDate", selectedDate); 
       } 
}); 


$("#to_date").datepicker({ 
showOn: 'button', 
buttonImage: 'images/calendar.gif', 
buttonImageOnly: true, 
dateFormat:'yy-mm-dd', 
onClose: function(selectedDate) { 
         $("#frm_date").datepicker("option", "maxDate", selectedDate); 
        } 
}); 

$(".datepick").datepicker({dateFormat:'yy-mm-dd',minDate:'2013-09-10' ,maxDate:'2013-10-10'}); 

Answer 1

我已經解決了我使用下面的代碼問題。
另請參閱下面的jQuery論壇網站上的解決方案。 https://forum.jquery.com/topic/how-to-set-minimum-and-maximum-date-dynamically-in-jquery-ui-date-picker

$.datepicker.setDefaults({ 
      showOn: 'button', 
      buttonImage: 'images/calendar.gif', 
      buttonImageOnly: true, 
      dateFormat: 'yy-mm-dd', 
      minDate: '2013-09-10', 
      maxDate: '2013-10-10' 
    }); 
    $('#frm_date').datepicker({ 
      onSelect: function(selectedDate) { 
       $('#to_date').datepicker('option', 'minDate', selectedDate || '2013-09-10'); 
      } 
    }); 
    $('#to_date').datepicker({ 
      onSelect: function(selectedDate) { 
       $('#frm_date').datepicker('option', 'maxDate', selectedDate || '2013-10-10'); 
      } 
    }); 

    $(".datepick").datepicker({dateFormat:'yy-mm-dd',minDate:'2013-09-10' ,maxDate:'2013-10-10'}); 

Answer 2

你可以調用beforeShow方法來設置顯示日曆之前的任何選項：

$("#to_date").datepicker({ 
    beforeShow:function(){ 
     $(this).datepicker('option', 
          { 
           minDate:new Date() 
          } 
         ); 
    } 
});