Bootstrap datetimepicker disable minutes

2019-05-21 10:55发布

问题:

I am using v4 from https://github.com/Eonasdan/bootstrap-datetimepicker. Now I am trying to disable the minutes-selector on time-selection. I know I could use:

$(this).datetimepicker({
  format: 'HH'
});

But with this code, minutes aren't shown at all. I would like to show minutes in the selector, but disable it. Any chance to achieve that?

回答1:

I tried using dp.show and dp.change events to handle it.

In the show event minutes element are disabled in order to avoid minutes changing and the hour part is taken and followed by :00.

Code:

$('#datetimepicker1').datetimepicker();
$('#datetimepicker2').datetimepicker({
    format: 'HH:mm'
}).on('dp.show', function () {
    $('a.btn[data-action="incrementMinutes"], a.btn[data-action="decrementMinutes"]').removeAttr('data-action').attr('disabled', true);
    $('span.timepicker-minute[data-action="showMinutes"]').removeAttr('data-action').attr('disabled', true).text('00');
}).on('dp.change', function () {
    $(this).val($(this).val().split(':')[0]+':00')
    $('span.timepicker-minute').text('00')
});

Demo: http://jsfiddle.net/mfjvnh9a/



回答2:

I've found a solution. Use this time-format:

format: 'HH:00'


回答3:

set plugin option 'minView' => 1



回答4:

$(this).datetimepicker({ steps: 60 });

If you do this when you loose focus the plugin adjusts your time to :00 for your minutes (if you happen to type the date).