![](/img/trans.png)
[英]I want to disable the past time in datetimepicker in codeigniter
[英]Is DateTimePicker cannot disable past time?
我想根据我选择的开始日期和结束日期来禁用过去的时间和日期。 我能够禁用我的日期,但它不会按时工作。
例:
Start Date - 24-May-2019 01:30 PM
End Date - 24-May-2019 01:00 PM < suppose to not be able to choose an earlier time
我试过这个功能,但是虽然禁用过去的日期工作正常,但仍然不能用
onSelect: function (selectedDate) {
var endYear = $(this).datetimepicker('getFullYear');
var endMonth = $(this).datetimepicker('getMonth');
var endDay = $(this).datetimepicker('getDate');
var endHour = $(this).datetimepicker('getHours');
var endMinutes = $(this).datetimepicker('getMinutes');
var endSeconds = $(this).datetimepicker('getSeconds');
("#endDate").datetimepicker("option", "minDate", new Date(endYear, endMonth, endDay, endHour, endMinutes, endSeconds));
}
onSelect: function (selectedDate) {
var endYear = $(this).datetimepicker('getFullYear');
var endMonth = $(this).datetimepicker('getMonth');
var endDay = $(this).datetimepicker('getDate');
var endHour = $(this).datetimepicker('getHours');
var endMinutes = $(this).datetimepicker('getMinutes');
var endSeconds = $(this).datetimepicker('getSeconds');
$("#startDate").datetimepicker("option", "maxDate", new Date(endYear, endMonth, endDay, endHour, endMinutes, endSeconds));
}
也试过下面这个功能,但也行不通
onSelect: function (selectedDate) {
$("#endDate").datetimepicker("option", "minDate", selectedDate);
$("#endDate").datetimepicker("option", "minTime", selectedDate);
}
onSelect: function (selectedDate) {
$("#startDate").datetimepicker("option", "maxDate", selectedDate);
$("#startDate").datetimepicker("option", "maxTime", selectedDate);
}
当前工作代码(仅禁用过去的日期):
开始日期
onSelect: function (selectedDate) {
$("#endDate").datetimepicker("option", "minDate", selectedDate);
}
工作代码
添加了一个onClose函数来读取时间
例如 :
如果用户选择开始日期05-May-2019 5:00 AM和结束日期05-May-2019 3:00 AM
开始日期值将自动更新至05-May-2019 3:00 AM
结束日期
onSelect: function (selectedDate) {
$("#startDate").datetimepicker("option", "maxDate", selectedDate);
}
对于startDate
onClose: function (dateText, inst) {
var startDateSelect = $('#startDate');
var endDateSelect = $('#endDate');
if (endDateSelect.val() != '') {
var sDate = startDateSelect.datetimepicker('getDate');
var eDate = endDateSelect.datetimepicker('getDate');
if (sDate > eDate)
endDateSelect.datetimepicker('setDate', sDate);
}
else {
endDateSelect.val(dateText);
}
},
onSelect: function (selectedDate) {
$("#endDate").datetimepicker("option", "minDate", selectedDate);
}
对于endDate
onClose: function (dateText, inst) {
var startDateSelect = $('#startDate');
var endDateSelect = $('#endDate');
if (startDateSelect.val() != '') {
var sDate = startDateSelect.datetimepicker('getDate');
var eDate = endDateSelect.datetimepicker('getDate');
if (sDate > eDate)
startDateSelect.datetimepicker('setDate', eDate);
}
else {
startDateSelect.val(dateText);
}
},
onSelect: function (selectedDate) {
$("#startDate").datetimepicker("option", "maxDate", selectedDate);
}
对于使用jquery DateTimePicker,还有用于设置最小/最大时间的选项。
使用minTime或maxTime作为日期使用minDate或maxDate
工作示例: https : //jsfiddle.net/qy48so6d/1/
$('#datetimepicker').datetimepicker({
minDate:'2019/05/01',
maxDate:'2019/05/02',
minTime:'01:00',
maxTime:'02:00'
});
参考: https : //xdsoft.net/jqplugins/datetimepicker/#minTime
如果您使用https://trentrichardson.com/examples/timepicker/
你可以试试这个
$("#endDate").datetimepicker("option", "minDateTime", selectedDate);
// or
$("#endDate").datetimepicker("option", "minTime", '8:00 am');
例
$(document).ready(function() {
var startDateTextbox = $('#startDate')
var endDateTextbox = $('#endDate')
startDateTextbox.datetimepicker({
onSelect: function(selectedDate) {
endDateTextbox.datetimepicker('option', 'minDate', startDateTextbox.datetimepicker('getDate'))
endDateTextbox.datetimepicker('option', 'minTime', '8:00 am')
endDateTextbox.datetimepicker('option', 'maxTime', '9:00 am')
}
});
endDateTextbox.datetimepicker({
minTime: '8:00 am'
});
})
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.