Skip to content
This repository

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP

A timepicker plugin for jQuery

branch: master
README.md

jquery-clockpick-timepicker-plugin

Click here to view a ClockPick demo

Configuration

Basic

After including the jQuery script in your html <head> block, include the jquery.clockpick.js file like so:
<script src="path/to/jquery.clockpick.js"></script>

Include the clockpick css file:
<link rel="stylesheet" href="path/to/clockpick.css" type="text/css">

Then in your $(document).ready block, simply add the following bit of code:

$("#clockpick").clockpick();

This assumes you are binding the plugin to an element with the id "clockpick". You can certainly bind the plugin to any element that makes sense for your use.

Adding parameters

ClockPick takes two optional parameters:
options (hash) - an object containing settings keys and their values
callback (function) - a callback function to run after ClockPick is run

Example:

$("#clockpick").clockpick({
starthour : 6,
endhour : 15,
showminutes : false
}, mycallback
);

Click target different
than value field

If you want to have the action on a different element than the time field, you would configure as below (like the "click on clock" demo).

Assuming the field you wish to have filled with the time, has the name 'myfieldname':

$(".clockpick").clockpick({
valuefield : 'myfieldname'
});



Something went wrong with that request. Please try again.