Skip to content
This repository

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP

Easy to use and well designed date picker widget with year in decades, month in year, day of month, and time of day support.

branch: master

This branch is 0 commits ahead and 0 commits behind master

Fetching latest commit…

Octocat-spinner-32-eaf2f5

Cannot retrieve the latest commit at this time

Octocat-spinner-32 src
Octocat-spinner-32 README.markdown
README.markdown

will_pickdate

Easy to use and well designed date picker widget with year in decades, month in year, day of month, and time of day support. Check it out Here

Most date pickers only support day of month. If you want to pick a time, you would require another time picker widget. This is both bad UX and bad UI. With will_pickdate, you can do all that and more within a single well designed widget. Clicking on the title will take you to the previous view, while selecting a year, month, or day will take you to the next view.

Usage

Default:

$(name_of_element).will_pickdate({});

With Time Selection (requires jquery.mousewheel):

$(name_of_element).will_pickdate({
    timePicker:true
});

Options

pickerClass: 'wpd'
days: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday']
months: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October','November', 'December']
dayShort: 2
monthShort: 3
startDay: 0 // Sunday (0) through Saturday (6) - be aware that this may affect your layout, since the days on the right might have a different margin
timePicker: false
timePickerOnly: false
yearPicker: true
militaryTime: false
yearsPerPage: 20
format: 'd-m-Y'
allowEmpty: false
inputOutputFormat: 'U' // default to unix timestamp
animationDuration: 400
useFadeInOut: !$.browser.msie // dont animate fade-in/fade-out for IE
startView: 'month' // allowed values: {time, month, year, decades}
positionOffset: { x: 0, y: 0 }
minDate: null // { date: '[date-string]', format: '[date-string-interpretation-format]' }
maxDate: null // same as minDate
debug: false
toggleElements: null

Callbacks

onShow: $.noop,   // triggered when will_pickdate pops up
onClose: $.noop,  // triggered after will_pickdate is closed (destroyed)
onSelect: $.noop  // triggered when a date is selected

Dependencies

  1. jQuery
  2. jquery.mousewheel if you would like to use the time picker

Authors

Take a look at the contributors page for a full list of contributors.

Inspired By

MooTools DatePicker

Licence

MIT

Something went wrong with that request. Please try again.