1.4.2 • Published 6 years ago
datepickr v1.4.2
Datepickr
The do it yourself date picker. It makes as no assumptions how it's shown on the page. See demo.
- Need to show/hide it on an input field? Do it yourself.
- Need to have it insert one date after selection? Do it yourself.
- Need nice formatted dates after selection? Do it yourself.
Usage
<div id='datepickr'></div>
<script>
var el = document.getElementById('datepickr');
new Datepickr(el, function(res) {
// console.log(res);
});
</script>API
new Datepickr(element, callback, options);
The callback returns an array of arrayed dates whenever a date is selected.
[
[1412481600000,1],
[1413864000000,1],
[1413950400000,1],
[1414468800000,1]
]The first field value is a timestamp along with 1 or 0.5 depending on
whether halfdays are enabled as an option or not.
| Option | Default Value | Description |
|---|---|---|
| weekdays | An array of weekday strings in English | Option for translation |
| months | An array of month strings in English | Option for translation |
| startYear | Current year | Start the date picker on a particular year |
| startMonth | Current month | Start the date picker on a particular month |
| minDate | null | a timestamp representing a maximum date the pager should page |
| maxDate | null | a timestamp representing a minimum date the pager should page |
| halfDay | false | Enables halfday selection of dates |
| omitPast | false | Prevent selecting days in the past |
| omitFuture | false | Prevent selecting days in the future |
| omitWeekends | false | Prevent selecting weekends |
| omitDays | Empty array | Pass a timestamp array of dates to prevent the selection of |
| activeDays | Empty array | Pass an array of arrayed dates ie. [[[1413950400000,1],[1414468800000,0.5] that are auto selected on load |
| utc | false | Should date output be interpreted as UTC |
| singleSelection | false | Limit days selection to one day. |
To see examples of each option see the demos.
Adding/Removing options after initialization.
var pickr = new Datepickr(el);
pickr.options({
halfDay: true
});Use with node or browserify.
// npm install datepickr
var datepickr = require('datepickr')
datepickr(el, function(res) {
console.log(res);
});Developing
npm install && npm startBuilding
npm run buildCredits
Code originally based off of datepickr.