[英]How to allow maxDate and minDate to be equal on Bootstrap DateTimePicker?
[英]How to set minDate and maxDate for bootstrap datetimepicker on change
我想使用bootstrap datetimepicker向用戶詢問日期范圍。 開始日期有一個字段,結束日期有另一個字段,它們初始化為當天前一天。 在更改開始日期時,我想將結束日期的minDate設置為開始日期的值; 在更改為結束日期時,我想將開始日期的最大日期設置為結束日期的值。 但我不能讓這個工作。
這是JS代碼:
var start = $('.start');
var end = $('.end');
var d = new Date();
var month = d.getMonth() + 1;
var day = d.getDate() - 1;
var year = d.getFullYear();
start.datetimepicker(
{
useCurrent: false,
defaultDate: month + '-' + day + '-' + year + ' ' + '12:00AM',
autoClose: true
})
.on('change', function (selected) {
end.minDate(selected.?????????); // What should replace the question marks?
});
end.datetimepicker(
{
useCurrent: false,
defaultDate: month + '-' + day + '-' + year + ' ' + '11:59PM',
autoClose: true
})
.on('change', function (selected) {
start.maxDate(selected.???????); // What should replace the question marks?
});
和HTML:
<div class="col-sm-3">
<div class="form-group">
<h4>Start Date</h4>
<div class="input-group date">
<input type="text" data-data-fomat="MM-DD-YYY h:mm A" data-ng-model="startDate" id="Calendar1" class="start form-control" placeholder="Choose a date" />
<span class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span>
</span>
</div>
</div>
</div>
<div class="col-sm-3">
<div class="form-group">
<h4>End Date</h4>
<div class="input-group date">
<input type="text" data-data-fomat="MM-DD-YYY h:mm A" data-ng-model="endDate" id="Calendar2" class="end form-control" placeholder="choose a date" />
<span class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span>
</span>
</div>
</div>
</div>
我在datepicker
上找到了關於類似操作的票證,但這與datetimepicker
做法不同,所以請不要標記重復,除非你找到datetimepicker
類似問題。
根據Bootstrap datetimepicker文檔中的Linked Pickers示例 ,這應該可行。
開始:
.on('dp.change', function (selected) {
end.data("DateTimePicker").minDate(selected.date);
});
結束:
.on('dp.change', function (selected) {
start.data("DateTimePicker").maxDate(selected.date);
});
注意:
在舊版本的Bootstrap datetimepicker(小於v4)上,使用.setMinDate
和.setMaxDate
開始日期
.on('dp.change', function (selected) { end.data("DateTimePicker").minDate(selected.date); });
結束日期
.on('dp.change', function (selected) { start.data("DateTimePicker").maxDate(selected.date); });
包升級 :日期timepicker包已升級到最新版本,我們可以使用'maxDate()'代替'setMaxDate()'和'minDate()'取代'setMinDate()',因為最近的選項考慮的是時間小時和分鍾,同時提供maxDate / minDate選項。
嘗試使用:
$('.datepickerProjectDate').data("DateTimePicker").minDate('2018-09-15');
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.