Bootstrap datepicker скрыть после выбора


Как скрыть календарь после выбора даты? Есть ли конкретная функция, которую я могу использовать? Мой код ниже:

$('#dp1').datepicker({
    format: 'mm-dd-yyyy',
    startDate: '-15d',
    autoclose: true,
    endDate: '+0d' // there's no convenient "right now" notation yet
});

любая помощь будет оценили.

16 81

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

$('#input').datepicker({autoclose:true});
  1. просто откройте bootstrap-datepicker.js
  2. найти : var defaults = $.fn.datepicker.defaults
  3. 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();
});
$('.datepicker').datepicker({
    autoclose: true
}); 

имея проблемы с часами все еще показывает, даже если я написал формат: 'гггг-ММ-ДД', я должен был установить 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();
});

по крайней мере в версии 2.2.3, что я использую, вы должны использовать autoClose вместо autoclose. Буквенный регистр имеет значение.

используйте это для datetimepicker, он отлично работает

$('#Date').данные ("DateTimePicker").hide ();