如何在日期選擇器的jQuery

我在這個方式使用datePicker選擇日期的未來：如何在日期選擇器的jQuery

$("#dataStart").datepicker({ 
beforeShow: function() { $('#ui-datepicker-div').css('z-index',9999); }, 
dateFormat: 'mm/dd/yy'}); 
$("#dataEnd").datepicker({ 
beforeShow: function() { $('#ui-datepicker-div').css('z-index',9999); }, 
dateFormat: 'mm/dd/yy'});

我想強制在未來，而不是過去選擇一個日期，是有可能做到這一點？如果是這樣，有可能以動態方式更改第二個日期選擇器，因此如果用戶選擇一個日期，則在第二個字段中他必須選擇第一個選定日期旁邊的日期。我希望我也問我的問題:) 謝謝大家！

來源

2012-02-02 JackTurky

minDate:1應該只允許日期，明天及以後。然後添加一個onselect限制dataEnd：

$("#dataStart").datepicker({ 
    minDate: 1, 
    onSelect: function(theDate) { 
     $("#dataEnd").datepicker('option', 'minDate', new Date(theDate)); 
    }, 
    beforeShow: function() { 
     $('#ui-datepicker-div').css('z-index', 9999); 
    }, 
    dateFormat: 'mm/dd/yy' 
});

參考：http://blog.alagad.com/2009/04/20/playing-with-jquery-datepicker/

例子：http://jsfiddle.net/jtbowden/F39kt/

來源

2012-02-02 21:35:51

datePicker在dataEnd中以這種方式不起作用... – JackTurky 2012-02-02 21:48:24

你是什麼意思？ – 2012-02-02 21:49:50

如果我點擊輸入文本日期選擇在dateend不顯示 – JackTurky 2012-02-02 21:50:49

var myDate = new Date(); 
myDate.setDate(myDate.getDate()+10); 
var prettyDate =(myDate.getMonth()+1) + '/' + myDate.getDate() + '/' + myDate.getFullYear(); 

$("#thedate").datepicker({dateFormat: 'mm/dd/yy',altFormat: 'yyyymmdd'}); 
$("#thedate").val(prettyDate);

這就是我該怎麼做的。 'thedate'是我的日期選擇器。我將日期推遲到今天+ 10天。

來源

2012-02-02 21:34:14 Sid

嘗試......

var dates=$("#from, #to").datepicker({ 
    changeMonth:true, onSelect: function(selectedDate) { 
     var option = this.id == "from" ? "minDate" : "maxDate", 
     instance = $(this).data("datepicker"), 
     date = $.datepicker.parseDate(instance.settings.dateFormat || $.datepicker._defaults.dateFormat, selectedDate, instance.settings); 
     dates.not(this).datepicker("option", option, date); 
    } 
});

來源

2012-02-02 21:34:53 bmoran

http://jqueryui.com/demos/datepicker/。

看那minDate選項。您可以使用option方法動態設置它。

來源

2012-02-02 21:34:54 Jasper

如果您在beforeShowDay事件日期選擇器的返回[虛假]，它禁用的那一天。您可以比較日期和當前日期，並相應地返回[true/false]。

試試這個。

$("#dataStart").datepicker({ 
    beforeShow: function() { 
     $('#ui-datepicker-div').css('z-index',9999); 
    }, 
    dateFormat: 'mm/dd/yy', 
}); 
$("#dataEnd").datepicker({ 
    beforeShow: function() { 
     $('#ui-datepicker-div').css('z-index',9999); 
    }, 
    dateFormat: 'mm/dd/yy', 
    beforeShowDay: function(date){ 
      return [(date > ($("#dataStart").datepicker("getDate") 
          || new Date()))]; 
    } 
});

Demo

來源

2012-02-02 21:35:24 ShankarSangoli

@JackTurky - 檢查了這一點。 – ShankarSangoli 2012-02-02 21:50:17

@JackTurky - 添加了比較結束日期和開始日期並相應地禁用日期的代碼。如果開始日期不可用，我只是將它與當前日期進行比較。 – ShankarSangoli 2012-02-02 21:55:16

這是一個古老的線程，但它有點得到澄清。可能是因爲改變了jQuery UI控件本身，而是對任何人絆倒在此：

要限制datepickers範圍將來的日期只 - 設置minDate參數去0

要限制過去的日期只有你將maxDate參數設置爲0.

這很好，因爲它避免了必須調用new Date()函數，正如本主題其他地方所建議的。

例子：

$('.your_datepicker').datepicker({ 
    minDate: 0 
});

來源

2015-12-04 18:47:57 DrewT

如何在日期選擇器的jQuery

回答

相關問題