Как предотвратить jQuery bootstrap ClockPicker, чтобы получить минуты, которые не делятся на 5

Question

Я использую jQuery bootstrap ClockPicker и вам нужно получить только время, когда их минуты делятся на 5. Например, если пользователь выбирает 13:08, ClockPicker должен выбрать 13 : 05.

Есть ли способ переопределить clockpicker, чтобы округлить выбранные времена минут?

Answer 1

Я не нашел способ сделать это с помощью API. Поэтому я написал один, используя обратный вызов afterDone.

Я проанализирую значение ввода и сделаю изменение, чтобы получить новое значение минут.

var clockpicker = $('.clockpicker').clockpicker({ 
 
    afterDone: function() { 
 
    clockpicker.val(round()); 
 
    } 
 
}).find('input'); 
 

 
function round() { 
 
    var time = clockpicker.val(), 
 
     arr = time.split(':'), 
 
     hour = arr[0], 
 
     min = arr[1], 
 
     newMin = (Math.floor(parseInt(min)/5)) * 5; 
 

 
    return hour + ':' + (newMin > 9 ? '' : '0') + newMin; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" /> 
 
<link href="https://weareoutman.github.io/clockpicker/dist/bootstrap-clockpicker.min.css" rel="stylesheet" /> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
 
<script src="https://weareoutman.github.io/clockpicker/dist/bootstrap-clockpicker.min.js"></script> 
 

 
<div class="input-group clockpicker col-xs-6"> 
 
    <input type="text" class="form-control" value="09:30"> 
 
    <span class="input-group-addon"> 
 
    <span class="glyphicon glyphicon-time"></span> 
 
    </span> 
 
</div>

http://jsbin.com/lopufu/edit?html,js

Answer 2

Если вы не возражаете, внести изменения в Clockpicker (я должен был сделать это для IE), добавляет неофициальный вариант, как "roundmodfive" в бутстраповской-clockpicker .js:
1. изменить это

// Hours and minutes are selected 
ClockPicker.prototype.done = function() { 
    raiseCallback(this.options.beforeDone); 
    this.hide(); 
    var last = this.input.prop('value'), 
     value = leadingZero(this.hours) + ':' + leadingZero(this.minutes); 
    if (this.options.twelvehour) { 
     value = value + this.amOrPm; 
    } 
... 

2. По й is

// Hours and minutes are selected 
ClockPicker.prototype.done = function() { 
    raiseCallback(this.options.beforeDone); 
    this.hide(); 

    var last = this.input.prop('value'); 
    //Unofficial option added 
    /* 
     Just an explain: 
      I like rounding. Thus, for example 43min => 45 and 42min => 40. 
      The minutes are base 60, so you have to make modulus 60. 
    */ 
    if (this.options.roundmodfive) { 
     this.minutes = (Math.round(parseInt(this.minutes)/5)) * 5 % 60; 
    } 

    var value = leadingZero(this.hours) + ':' + leadingZero(this.minutes); 
    if (this.options.twelvehour) { 
     value = value + this.amOrPm; 
    } 
...