jqueryjquery-mobiledatepickerdatebox

How to hide invalid minutes and hours in JQM Datebox Time Flipbox?


For eg, the code below does not allow the user to select any minutes apart from 0, 15, 30 and 45. But the other minutes are visible, though you will not be able to select them.

<div class="ui-field-contain">
  <label for="mode4">Dropoff Time</label>
  <input data-options='{"mode":"timeflipbox","minuteStep":"15","minuteStepRound":"1","useFocus":"true","overrideTimeOutput":"%l:%M %p"}' data-role="datebox" id="mode4" name="mode4" type="text"></input>
</div>

How do I hide all the minutes apart from 0, 15, 30 and 45, so that only these 4 are visible for selection?

As a side note, is there any other jqm extension which provides the flip functionality for time and date selection; apart from jqm datebox and mobiscroll?


Solution

  • Your code is actually correct - DateBox not respecting the minuteStep directive in flipbox was a bug, not intended behavior.

    Changes are here: https://github.com/jtsage/jquery-mobile-datebox/commit/9df43c5e37409db460f7d2ea368b506427c8b71e

    Original Bug Report is here: https://github.com/jtsage/jquery-mobile-datebox/issues/362