jquery datetime picker set minDate dynamic

我們這些人我使用trentrichardson.com的datetimepicker。jquery datetime picker set minDate dynamic

我有兩個輸入字段的表單：從和到，我希望能夠動態設定的minDate我「到」字段等於我的「從」字段的值。

我知道我應該使用beforShow選項，但不知道如何實現該功能。

$('.from,.to').datetimepicker({ 

    beforeShow: customRange 

});

編輯/解決方案

function customRange(input) { 
if (input.id == 'to') {  
var x=$('#from').datepicker("getDate"); 
$(".to").datepicker("option", "minDate",x); 
} 
else if (input.id == 'from') {  
var x=$('#to').datepicker("getDate"); 
$(".from").datepicker("option", "maxDate",x); 
} }

來源

2011-03-21 luca

您可以設置與setter和getter動態獲取的minDate：

//getter 
var minDate = $(".selector").datepicker("option", "minDate"); 
//setter 
$(".selector").datepicker("option", "minDate", new Date(2007, 1 - 1, 1));

explained here

來源

2011-03-21 08:45:46 felixsigl

我需要輸入字段「至」至少等於「from」字段中的任何日期值 – luca 2011-03-21 08:52:41

要做到這一點，請參考我的答案：http://stackoverflow.com/a/20010398/2246679 – Tanvir 2013-11-15 20:54:48

你可以restrict the datepicker range。

但是你想在「from」創建datepicker時設置這個範圍。我made you a demo這似乎工作確定，據我瞭解的問題。

來源

2011-03-21 09:05:53 andyb

Hi @ andyb，感謝您的代碼。但是選擇「從」和「到」日期一次，然後再從「日期」再次重新選擇，然後「到」日期不能根據新選擇的「從」日期更新。？ – 2015-10-29 09:10:27

@Elena我沒有看到這個問題的演示。在設置了兩個日期之後，然後將「from」更改爲過去或之後的「to」，然後打開「to」日期選擇器顯示過去的更多日期或將其設置爲「從」日期。你能否詳細說明這個問題，或者你是否可以創建一個演示，然後可能會問一個新問題？ – andyb 2015-10-29 10:30:25

嗨，在你的演示中它完美的作品。但是當我插入這些行到我的jquery月份選擇器（「到」日期選擇部分）。然後就像我在第一部分描述的那樣發生問題。請參閱我在此鏈接中發佈的代碼：http：//stackoverflow.com/questions/33411152/django-jquery-month-picker-the-to-date-not-always-updated-as-later-than-from。提前致謝。 – 2015-10-30 01:26:39

trentrichardson.com上有一個example。他們正在使用「onSelect」。對我而言，這並不是完美的。設置minDate或MaxDate時，時間分量設置爲0，並且只保留日期。我必須解決一些本地化問題。

來源

2012-01-23 10:10:35 uli78

盧卡：一個小的除了你的答案...

使用你建議的時間成分的功能被忽略，在第一時間顯示的DateTimePicker。如果關閉datetimepicker並重新打開它，時間組件會神祕地重現。我不太清楚是什麼原因造成這一點，但它可以固定一個黑客位的：

function setMinMaxDate (element) 
{ 
    // Store current date - setting max/min date seems to destroy time component 
    var val = $(element).val(); 

    if (element.id == 'endDate') 
    {  
     var x=$('#startDate').datetimepicker("getDate"); 
     $(element).datetimepicker("option", "minDate",x); 
    } 
    else if (element.id == 'startDate') 
    {  
     var x=$('#endDate').datetimepicker("getDate"); 
     $(element).datetimepicker("option", "maxDate",x); 
    } 

    // Restore date 
    $(element).val(val); 
}

來源

2012-02-17 05:14:22

如果你有兩個文本框與相應的ID from和to和你想的to的minDate是的from選定日期然後執行以下操作：

$("#from").datepicker({ 
    minDate: 0, // to disable past dates (skip if not needed) 
    onClose: function(selectedDate) { 
     // Set the minDate of 'to' as the selectedDate of 'from' 
     $("#to").datepicker("option", "minDate", selectedDate); 
    } 
}); 

$("#to").datepicker();

來源

2013-11-15 20:53:25 Tanvir

這是否也適用於dateTIMEPicker？ – JosephK 2014-10-22 09:31:28

以上答案都不幫我。它要麼沒有工作，要麼出現某種錯誤。

所以我把它們合併在一起，並創造了我自己的一個。我使用上面提到的moment.js，只需下載它並將其包含在您的頁面中即可。

$("#start_date").datetimepicker({ 
    format: 'Y-m-d H:00:00', 
    onChangeDateTime: function(dp, $input){ 
     var dt2 = $('#end_date'); 
     var minDate = $('#start_date').val(); 
     var currentDate = new Date(); 
     var targetDate = moment(minDate).toDate(); 
     var dateDifference = currentDate - targetDate; 
     var minLimitDate = moment(dateDifference).format('YYYY/MM/DD'); 
     var endDate = moment(dt2.val()).toDate(); 
     if((currentDate - endDate) >= (currentDate - targetDate)) 
      dt2.datetimepicker({ 
       'value': minDate 
      }); 
     dt2.datetimepicker({ 
      'minDate': '-'+minLimitDate 
     }); 
    } 
}); 
$("#end_date").datetimepicker({ 
    format: 'Y-m-d H:00:00' 
});

我相信有更好的方法來做到這一點，但我找不到它。所以我希望這可以幫助未來的人。

來源

2015-09-30 12:40:25 Chris

jquery datetime picker set minDate dynamic

回答

相關問題