Как автоклинировать datetimepicker Bootstrap, используя событие dp.change?

Question

Как автоклинировать datetimepicker только для даты. Я использую событие dp.change, но он закрывает datetimepicker даже при изменении времени.

$('.datetimepicker').each(function() { 
    $(this).on('dp.change', function (ev) { 

     $(this).data('DateTimePicker').hide(); 

    }); 
}); 

Каким будет имя класса для времениPicker? Что, если я получу класс и скажу, что datetimepicker не закрывается, если className равно классуName timepicker?

И какова последняя версия для datetimepicker?

1 является следующее: http://eonasdan.github.io/bootstrap-datetimepicker/

второй это с AUTOCLOSE собственности.

http://www.malot.fr/bootstrap-datetimepicker/

Спасибо.

Answer 1

Используя eonasdan datetimepicker, вы можете проверить, совпадает ли новая выбранная дата с предыдущей выбранной датой (с использованием момента isSame).

Примечание: dp.change принимает oldDate и date в качестве параметра.

Вот рабочий пример:

$('.datetimepicker').datetimepicker().on('dp.change', function(e){ 
 
    if(!e.oldDate || !e.date.isSame(e.oldDate, 'day')){ 
 
    $(this).data('DateTimePicker').hide(); 
 
    } 
 
});

<link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/css/bootstrap.css" rel="stylesheet"/> 
 
<link href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.42/css/bootstrap-datetimepicker.css" rel="stylesheet"/> 
 

 
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.js"></script> 
 
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.15.1/moment.min.js"></script> 
 
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.15.1/locale/en-gb.js"></script> 
 
<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/js/bootstrap.js"></script> 
 
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.42/js/bootstrap-datetimepicker.min.js"></script> 
 

 
<div class="input-group date datetimepicker"> 
 
    <input type="text" class="form-control" /> 
 
    <span class="input-group-addon"> 
 
    <span class="glyphicon glyphicon-calendar"></span> 
 
    </span> 
 
</div>