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.
Default:
$(name_of_element).will_pickdate({});
With Time Selection (requires jquery.mousewheel):
$(name_of_element).will_pickdate({
timePicker:true
});
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
initializeDate: null // Set this to a Date object
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
- jQuery
- jquery.mousewheel if you would like to use the time picker
Take a look at the contributors page for a full list of contributors.
MIT