我試圖禁用結束日期以防止用戶在他們首先選擇開始日期之前選擇結束日期,這是我的代碼:
// Datepicker
$('.dtpicker').datepicker({
startDate: new Date(),
format: "dd-MM-yyyy",
todayBtn: "linked",
autoclose: true,
});
$(document).ready(function(){
$("#periode_end").attr("disabled", "disabled");
$("#periode_start").datepicker({
todayBtn: "linked",
format: "dd-MM-yyyy",
autoclose: true,
}).on('changeDate', function (selected) {
var minDate = new Date(selected.date.valueOf());
$("periode_end").removeAttr("disabled");
$('#periode_end').datepicker('setStartDate', minDate);
});
$("#periode_end").datepicker({
format: "dd-MM-yyyy",
autoclose: true,
})
.on('changeDate', function (selected) {
var maxDate = new Date(selected.date.valueOf());
$('#periode_start').datepicker('setEndDate', maxDate);
});
});
但它完全禁用結束日期,即使用戶已經輸入了開始日期。我錯過了什么或有人有解決方案嗎?,謝謝。
uj5u.com熱心網友回復:
我嘗試閱讀檔案,您可以使用以下方法設定 minDate:
$( ".selector" ).datepicker( "option", "minDate", new Date(2007, 1 - 1, 1) );
因此,根據您的情況,您可以嘗試:
$('.dtpicker').datepicker({
startDate: new Date(),
format: "dd-MM-yyyy",
todayBtn: "linked",
autoclose: true,
});
$(document).ready(function(){
$("#periode_end").prop("disabled", true)
.datepicker({
format: "dd-MM-yyyy",
autoclose: true,
}).on('changeDate', function (selected) {
var maxDate = new Date(selected.date.valueOf());
$('#periode_start').datepicker('option', 'maxDate', maxDate);
});
$("#periode_start").datepicker({
todayBtn: "linked",
format: "dd-MM-yyyy",
autoclose: true,
}).on('changeDate', function (selected) {
var minDate = new Date(selected.date.valueOf());
//here you set disabled to false, and set min date for periode_end
$("#periode_end").prop("disabled", false)
.datepicker('option', 'minDate', minDate);
});
});
uj5u.com熱心網友回復:
嘗試這個,
// 日期選擇器
$('.dtpicker').datepicker({
startDate: new Date(),
format: "dd-MM-yyyy",
todayBtn: "linked",
autoclose: true,
});
$(document).ready(function(){
$("#periode_end").attr('disabled', true);
$("#periode_start").datepicker({
todayBtn: "linked",
format: "dd-MM-yyyy",
autoclose: true,
}).on('changeDate', function (selected) {
var minDate = new Date(selected.date.valueOf());
**// add this**
if(!new Date($(this).val())){
$("#periode_end").attr('disabled', true);
}else{
$("#periode_end").attr('disabled', false);
}
//
$('#periode_end').datepicker('setStartDate', minDate);
});
$("#periode_end").datepicker({
format: "dd-MM-yyyy",
autoclose: true,
})
.on('changeDate', function (selected) {
var maxDate = new Date(selected.date.valueOf());
$('#periode_start').datepicker('setEndDate', maxDate);
});
});
轉載請註明出處,本文鏈接:https://www.uj5u.com/yidong/344435.html
標籤:php 拉拉维尔 jquery-ui-datepicker
