The missing timepicker for jQuery's Datepicker.

I would not recommend you to use this plugin because you may end up hitting your head against the wall. Instead, use the timepicker plugin from Trent Richardson.

timepicker

I have made this simple timepicker. It is very early release and it is buggy. You can see demo here.

Configuration

It is simple to configure. You only need these 3 options to work correctly (duration, showTime, constrainInput).

<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>

<script type="text/javascript" src="js/jquery-ui-1.7.2.custom.min.js"></script>
<script type="text/javascript" src="js/timepicker.js"></script>

<script type="text/javascript">
$(function() {
    $('#datetime').datepicker({
    	duration: '',
        showTime: true,
        constrainInput: false,
        stepMinutes: 1,
        stepHours: 1,
        altTimeField: '',
        time24h: false
     });
});
</script>

<input type="text" name="datetime" id="datetime" value="01.06.2009 00:00">
  

TODO

  • am/pm
  • localization
  • effects
  • dragging
  • display inline


Known Issues

  • colon in date part breaks timepicker
  • duration option must be empty


Change log

  • 0.2.1
    • fix: datepicker wont close when user selects a date
  • 0.2.0
    • new: 12h & 24h time
    • new: sliders now supports increments
    • new: populate an alternate field with time
    • fix: incorect parsing time
  • 0.1.2
    • fix: keep same height as datepicker
    • fix: don't reset time when changing months
    • fix: leave input field unchanged when not selecting date or time
  • 0.1.1
    • fix: can't select date when input field is empty and datepicker is closed without selecting date
  • 0.1.0
    • initial release


Download

Version 0.2.1 - 15.8.2009 timepicker-0.2.1.zip