jQuery datetimepicker range select example
使用 jQuery datetimepicker 官網的範圍選擇範例遇到時間會自動消失的問題。
就是如果另外一個日期時間欄位(B)有預設值，在 B 的 datetimepicker 尚未顯示前就已經在 A 選好的值的話，會造成 B 的時間消失，且 A 跟 B 的 minDate/maxDate 效果會出不來。
以下是防止這個問題出現的範例，另外根據個人喜好加上限制時間的 minDateTime/maxDateTime 選項：
var dates = $('#from, #to').
each(function(){
if ( this.value ) {
var option = this.id === 'from' ? 'minDate' : 'maxDate';
$('#from, #to').not(this).
attr('time:'+option, 'new Date("'+this.value+'")').
attr('time:'+option+'Time', 'new Date("'+this.value+'")');
}
}).
datetimepicker({
dateFormat: 'yy-mm-dd',
timeFormat: 'hh:mm:ss',
changeMonth: true,
alwaysSetTime: true,
changeYear: true,
hourGrid: 4,
minuteGrid: 10,
onSelect: function(selectedDatetime, inst) {
var $_ = $(this),
option = this.id === 'from' ? 'minDate' : 'maxDate',
date = $_.datetimepicker('getDate'),
other = dates.not(this);
if ( other.val()) {
var otherDate = other.datetimepicker('getDate');
// limit current input
if (
( this.id === 'from' && date.getTime() > otherDate.getTime()) ||
( this.id === 'to' && date.getTime() < otherDate.getTime())
) {
date = new Date(otherDate.getTime());
$_.datetimepicker('setDate', date);
}
// set other date
other.
datetimepicker('setDate', otherDate);
}
other.
datetimepicker('option', option, date ).
datetimepicker('option', option+'Time', date );
}
});
19 Notes/ Hide
-
practicing90fg liked this
-
communityto69 liked this
-
castelinoui5 liked this
-
nahoya posted this
