cp_timepicker

pick hour and minutes

by bryiantan

HTML

<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.min.js"></script>
<script src="https://fgelinas.com/code/timepicker/jquery.ui.timepicker.js?v=0.3.3"></script>
<link rel="stylesheet" href="https://fgelinas.com/code/timepicker/jquery.ui.timepicker.css?v=0.3.3">
 <label for="timepicker_hours">Input for hours only :</label>
        <input type="text" style="width: 100px" id="timepicker_hours" value="" placeholder="enter hour"><br/>
        <label for="timepicker_minutes">input for minutes only :</label>
<input type="text" style="width: 100px" id="timepicker_minutes" value="" placeholder="enter minutes">

JavaScript

$('#timepicker_hours').timepicker({
    showMinutes: false,
    showPeriod: false,
    showLeadingZero: true,
    hours: {
        starts: 0,                // First displayed hour
        ends:23                  // Last displayed hour
    },
});
$('#timepicker_minutes').timepicker({
    showHours: false,
     minutes: {
        starts: 0,                // First displayed minute
        ends: 60,                 // Last displayed minute
        interval: 1,              // Interval of displayed minutes
    },
});