🔔 Alert..!! Get 2 Month Free Cloud Hosting With $200 Bonus From Digital Ocean ACTIVATE DEAL

A very small jQuery week picker plugin that enables the user to pick a week (or multiple weeks) from a calendar popup (year view).

week-picker

Documentation

week-picker

Week-picker is an ISO-8601 picker for easily selecting weeks.

Requirements

Initialize a picker

All elements with the class week-picker are automatically initialized on page load.

For manual initialization, $(elem).weekPicker("init") initialises an element.

<div class="week-picker"></div> <!-- Use defaults --> <div class="week-picker" data-locale="se"></div> <!-- Swedish locale --> <div class="week-picker" data-mode="single"></div> <!-- Single mode -->

Localization is supported for se and en. Defaults to en.

The possible modes are multi and single. Defaults to multi.

Usage

Value

$(elem).weekPicker("value") // [ "2017-01-09", "2017-02-13", "2017-02-27", "2017-03-20", "2017-05-29", ... ]

Returns the date of every weeks monday in format YYYY-MM-DD

Clear

You can clear the picker programmatically (same as pressing "clear").

$(elem).weekPicker("clear")

Events

When the picker is changed, a "change" event is dispatched. event.details contains data about the change, like the range selected and the mode (select or deselect).

// Multi-mode example (default) $(".week-picker").on("change", function (event) { 	console.log(event.detail) // { mode: "select", range: ["2017-06-19", "2017-06-26", "2017-07-03"] } })  // Single-mode example $(".week-picker").on("change", function (event) { 	console.log(event.detail) // { mode: "deselect", range: ["2017-06-12"] } })

Demo

Here


You May Also Like