2017-09-01 25 views
0

我在頁面上有2 datepicker s。預計用戶可以輸入兩個彼此接近的日期。但是,如果用戶提前6個月跳過,他們的直覺告訴他們,當他們點擊第二個datepicker時,它將已經在同一個月。將jQuery datepicker的值設置爲另一個日期選擇器的值

我需要將第二個datepicker的defaultDate設置爲第一個datepicker中選定的日期。

$("#from").datepicker({ 
 
    defaultDate: new Date(), 
 
    minDate: new Date(), 
 
    onSelect: function(dateStr) 
 
    {   
 
     $("#to").val(dateStr); 
 
     $("#to").datepicker("option",{ minDate: new Date(dateStr)}) 
 
    } 
 
}); 
 

 
$('#to').datepicker({ 
 
    defaultDate: new Date(), 
 
    onSelect: function(dateStr) { 
 
    toDate = new Date(dateStr); 
 
    fromDate = ConvertDateToShortDateString(fromDate); 
 
    toDate = ConvertDateToShortDateString(toDate); 
 
    } 
 
});
<link href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" rel="stylesheet"/> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 
 
<input id="from"> 
 
<input id="to">

但它無法運行。事實上,它根本沒有初始化datepicker。我不知道爲什麼。只要讓他們像正常datepicker s當然工作正常。

有沒有人有任何其他方法來實現我的目標?

+0

也...上忽略片段這裏。它沒有jQuery 1.12,因此無法用作測試方法。 –

+0

編輯:我看到你更新了你的答案。看到這個小提琴包括jQuery的邊緣和jQuery的UI和這段代碼工作正常。 https://jsfiddle.net/gLrumpo3/5/ – luxdvie

回答

0

使用jQuery UI的方法 「秀」

$('#to').datepicker({ 

     }); 

$("#from").datepicker({ 
      defaultDate: new Date(), 
      minDate: new Date(), 
      onSelect: function(dateStr) 
      { 
        $("#from").datepicker("hide"); 
       $('#to').val(dateStr); 
       $('#to').focus(); 
       $('#to').datepicker("show"); 
       $("#to").datepicker("option", "minDate", endDate); 
         //$("#to").datepicker("option", "maxDate", '+2y'); 
      } 
     }); 

它的調用,以示對工作的想法是

我留下的jsfiddle:https://jsfiddle.net/roberburnday/btn7bp2v/

相關問題