Bootstrap datepicker скрыть после выбора
Как скрыть календарь после выбора даты? Есть ли конкретная функция, которую я могу использовать? Мой код ниже:
$('#dp1').datepicker({
format: 'mm-dd-yyyy',
startDate: '-15d',
autoclose: true,
endDate: '+0d' // there's no convenient "right now" notation yet
});
любая помощь будет оценили.
16 ответов:
вы можете использовать событие
changedate()
чтобы отслеживать, когда дата изменяется вместе сdatepicker('hide')
способ скрытьdatepicker
после выбора:$('yourpickerid').on('changeDate', function(ev){ $(this).datepicker('hide'); });
обновление
Это была ошибка с
autoclose: true
. Эта ошибка была исправлена в последней версии master. СМОТРИТЕ COMMIT. Получить последний код GitHub
Если это какая-либо помощь кому-либо, версия 2.0 bootstrap datepicker больше не работает с принятым ответом.
вот как я заставил его работать на моем:
$('yourpickerid').datepicker({ format: 'dd/mm/yyyy', }).on('changeDate', function(e){ $(this).datepicker('hide'); });
см.http://bootstrap-datepicker.readthedocs.org/en/latest/events.html#changedate
- просто откройте
bootstrap-datepicker.js
- найти :
var defaults = $.fn.datepicker.defaults
- set
autoclose: true
сохраните и обновите свой проект, и это должно сделать.
Если вы хотите переопределить поведение календаря в целом, глобально, попробуйте изменить функцию Datepicker (в моем примере это была строка 82),
С
this.autoclose = false;
до
this.autoclose = true;
отлично работал для меня, так как я хотел, чтобы все мои экземпляры календаря вели себя одинаково.
проблема может быть остановлена, блокируя скрыть событие для элемента ввода этой строкой:
var your_options = { ... }; $('.datetimepicker').datetimepicker(your_options).on('hide', function (e) { e.preventDefault(); e.stopPropagation(); });
$('yourpickerid').datetimepicker({ pickTime: false }).on('changeDate', function (e) { $(this).datetimepicker('hide'); });
закрыть datetimepicker при выборе даты (datetimepicker показать дату со временем)
$('.datepicker').datepicker({ autoclose: true, closeOnDateSelect: true });
вы можете изменить исходный код, bootstrap-datepicker.js. Добавить это.hide (); like ne
if (this.viewMode !== 0) { this.date = new Date(this.viewDate); this.element.trigger({ type: 'changeDate', date: this.date, viewMode: DPGlobal.modes[this.viewMode].clsName }); this.hide();//here
}
Я получил идеальное решение:
$('#Date_of_Birth').datepicker().on('changeDate', function (e) { if(e.viewMode === 'days') $(this).blur(); });
имея проблемы с часами все еще показывает, даже если я написал формат: 'гггг-ММ-ДД', я должен был установить pickTime: false и после изменения - > скрыть я должен был сосредоточиться - >показать
$('#VBS_RequiredDeliveryDate').datetimepicker({ format: 'YYYY-MM-DD', pickTime: false }); $('#VBS_RequiredDeliveryDate').on('change', function(){ $('.datepicker').hide(); }); $('#VBS_RequiredDeliveryDate').on('focus', function(){ $('.datepicker').show(); });
для выбора даты и времени
$('yourpickerid').datetimepicker({ format: 'dd/mm/yyyy', }).on('changeDate', function(e){ $(this).datetimepicker('hide'); });
изменился на datetimepicker и формы 'DD / MM / YYYY'
$("id").datetimepicker({ format: 'DD/MM/YYYY', }).on('changeDate', function() { $('.datepicker').hide(); });