具有自動對焦和最短日期的雙日期日曆日曆

我使用了2個jquery日期選擇器，一個用於出發，一個用於返回。具有自動對焦和最短日期的雙日期日曆日曆

我希望第二個自動打開並將最短日期設置爲第一個日曆+ 1天中選定的值（即第一個日曆日期是5月21日，第二個日曆應該將最短日期設置爲5月22日）。

截至目前，我可以自動填充第二個日曆的默認日期到第一個日期中選擇的日期。

$("#dep_date").datepicker({dateFormat: 'dd/mm/yy', numberOfMonths: 3, minDate: +2, onSelect: function(dateText, inst){$("#ret_date").val(dateText);}}); 
$("#ret_date").datepicker({dateFormat: 'dd/mm/yy', numberOfMonths: 3});

來源

2011-04-18 dawgbone

怎麼是這樣的：

$("#dep_date").datepicker({ 
    dateFormat: 'dd/mm/yy', 
    numberOfMonths: 3, 
    minDate: +2, 
    onSelect: function(dateText, inst) { 
     var date = $.datepicker.parseDate('dd/mm/yy', dateText); 
     date.setDate(date.getDate() + 1); 

     var $ret_date = $("#ret_date"); 

     $ret_date.datepicker("option", "minDate", date);    
     $ret_date.datepicker("setDate", date); 

     $(this).datepicker("hide"); 

     $ret_date.datepicker("show"); 
    } 
}); 

$("#ret_date").datepicker({ 
    dateFormat: 'dd/mm/yy', 
    numberOfMonths: 3 
});

詳情：

用途上datepicker
的setDate方法設置上datepicker
的minDate選項調用show方法Ø n中的下一個datepicker

這裏有一個工作示例：http://jsfiddle.net/4tay7/

來源

2011-04-18 23:13:54

是啊，這工作完美。我正在嘗試$ ret_date.datepicker（「minDate」，日期）並沒有採取，所以我想我需要選項。另外我試圖使用焦點焦點事件。 – dawgbone 2011-04-19 13:46:16

@dawgbone：很高興幫助！如果它適合你，請接受答案。 – 2011-04-19 14:36:04

完成！我注意到的一件事是，如果在$ ret_date.datepicker（「option」，「minDate」，date）之前有'$ ret_date.datepicker（「setDate」，date）;'並且選擇未來日期一個月後），然後將其更改爲比第一次選擇更早的日期（比如說下週），第二次日曆不會默認爲新日期，因爲它使用的是第一次選擇的minDate。因此，只需將訂單更改爲'$ ret_date.datepicker（「option」，「minDate」，date）; $ ret_date.datepicker（「setDate」，日期）;'它工作正常。 – dawgbone 2011-04-19 18:05:22

具有自動對焦和最短日期的雙日期日曆日曆

回答

相關問題