The Hoju Saram

Monday, October 02, 2006

Javascript clock face time selection control


I was asked over the weekend about a publishing some code for a time selection control ( or time picker control) I developed some time ago when I was building a timesheeting application. Basically this is a couple of pages that allows a web developer to use a graphical clock as the user interface when someone needs to select a time. This could be the time of day or a length of time. This is much easier for the user than scrolling through a big pick-list of time choices, or trying to guess the format that a system wants for a given time field. The examples and downloadable source for this is available here

There are 5 versions:

  • A standard clock control which is used to select a time from a clock face the time format is HH:MM am/pm
  • Small Timer HH:MM - Used for recording lengths of time taken to do something that is always less than 12 hours. Time format is HH:MM
  • Small Timer HH.mm - Same as the Small Timer HH:MM except results are in HH.mm where mm is decimal fraction of hours not actual minutes
  • Large Timer HH:MM - Used for recording large lengths of time, user selects minutes from a clock face but can enter the number of hours.
  • Large Timer HH.mm – Same as Large Timer HH:MM except results are in HH.mm where mm is decimal fraction of hours not actual minutes

0 Comments:

Post a Comment

<< Home