Отключить несколько часов начальной загрузки datetimepicker
Я хочу отключить выбор нескольких часов с помощью начальной загрузки datetimepicker, потому что я хочу выбирать только время с 8:00 до 19:00.
Я ничего не могу найти по этому поводу. Вы можете мне помочь?
6 ответов
Это должно работать:
$(".datepicker").datetimepicker({
hoursDisabled: '0,1,2,3,4,5,6,7,18,19,20,21,22,23'
});
а также это:
hoursDisabled: [0, 1, 2, 3, 4, 5, 6, 7, 8, 18, 19, 20, 21, 22, 23]
Потому что в bootstrap-datetimepicker.js:
setHoursDisabled: function (hoursDisabled) {
this.hoursDisabled = hoursDisabled || [];
if (!$.isArray(this.hoursDisabled)) {
this.hoursDisabled = this.hoursDisabled.split(/,\s*/);
}
...
},
Это сработало для меня:
$(".datepicker").datetimepicker({
enabledHours:[8,9,10,11,12,13,14,15,16,17,18,19]
});
В bootstrap-datetimepicker.js
файл, отключенные часы определяются следующим образом;
var hoursDisabled = this.hoursDisabled || [];
Если вы используете дату и время только в одном месте, вы можете просто изменить это []
в [0, 1, 2, 3, 4, 5, 6, 7, 8, 18, 19, 20, 21, 22, 23]
в исходном файле JavaScript. Но если вы используете дату и время в нескольких местах, лучше поменять отключенные часы в вашем html-файле или в отдельном js-файле. Вот код для этого;
<script type="text/javascript">
$('.form_datetime').datetimepicker('setHoursDisabled', [0, 1, 2, 3, 4, 5, 6, 7, 8, 18, 19, 20, 21, 22, 23]);
</script>
Лучший способ выполнить это.....
$(".datepicker").datetimepicker({ enabledHours:[8,9,10,11,12,13,14,15,16,17,18,19,20,21,22] });
Попробуй это. Вы можете отключить HourInterval
$(function () {
$('#time1').datetimepicker({
format: 'HH:mm:ss',
pickDate: false,
minuteStepping:30,
pickTime: true,
autoclose: true,
defaultDate: new Date(1979, 0, 1, 8, 0, 0, 0),
//this is what you will need!
disabledTimeIntervals: [[moment({ h: 0 }), moment({ h: 8 })], [moment({ h: 18 }), moment({ h: 20 })]],
//hoursDisabled: '0,1,2,3,4,5,6,7,21,22,23',//Not Working!!
//hoursDisabled: [00, 01, 02, 03, 04, 05, 06, 07, 21, 22, 23],//Not Working!!
language:'en',
});
});
Дополнительные параметры: https://eonasdan.github.io/bootstrap-datetimepicker/Options/
Опубликованные выше решения на самом деле не работали, но это работало при каждом просмотре:
<input type="text" id="deliverydate" name="deliverydate" autocomplete="off" required="">
<script src="../js/calendar/jquery.datetimepicker.full.js"></script>
<script type="text/javascript">
$('#deliverydate').datetimepicker({
format:'Y-m-d H:i',
allowTimes:['11:00','12:00','13:00','14:00','15:00','16:00','17:00','18:00','19:00', '20:00','21:00','22:00','23:00'],
minDate:0
});
</script>
Это отключает выбор предыдущей даты и ограничивает выбор времени, и это было протестировано на действующем веб-сайте и в разных браузерах.