jQuery Date Range Picker Plugin#

v1.0.0

jQuery Date Range Picker is a jQuery plugin that allows user to select a date range.

Requires jQuery and Moment. Based on jquery.date-range-picker written by Chunlong ( jszen.com )

Features

• Runs everywhere: Supports IE8+, Firefox, Chrome, Safari and other standard HTML5 browsers. Powered by Babel
• Fully international: Built-in support for many languages - or just add your own!
• Styleable: Fully CSS styled, using SASS for development
• Customizable: Just change the settings in Brocfile.js or lib/config.js to create a customized build.
• Easily hackable: Code divided into modules, with quality ensured by JSHint and JSCS
• Ready for the future: Source code written in ECMA Script 2015

Build instructions

To get started with development, you should first install all dependendencies:

npm install

This project is built using Broccoli. Install it globally using sudo npm install -g broccoli-cli After that, you can build sass, javascript and also a minified version by running

broccoli build dist

The compiled scripts can be found in the newly created dist directory.

To make development more convenient, this repository also includes a Gruntfile to automate tasks using Grunt. As you did with Broccoli, you should install the global grunt command using

sudo npm install -g grunt-cli

The following tasks are currently available:

• grunt watch: A watcher task that automatically rebuilds javascript and sass when you save your changes
• grunt jscs: Runs a codestyle checker to maintain code quality
• grunt jshint: Runs a linter on the project to detect general problems with the code
• grunt broccoli:dist:build: Builds the project in release mode (also known as production)
• grunt broccoli:dev:build: Builds the project in development mode

Demo

For a demo page, just open demo/index.html in your browser

Similar projects

• bootstrap-datepicker also has a range option
• bootstrap-daterangepicker is a project with pretty much the same featureset and similar behavior as this plugin
• jquery-ui-daterangepicker: a daterange picker plugin for jquey-ui
• jquery.dateRangePicker has a completely different concept for the ui which may work better for touch-devices
• yui's calendar widget supports basic date range selects (using shift key)
• lightRange is a nice little widget specifically designed to be as lightweight as possible. Refer to this disucssion to see some of the author's motives.
• daterange picker on flights.google.com: Although not open source, it may serve as a good inspiration for what is considered good usability.

There is also this question on stackoverflow, although it was closed as 'not constructive'.

License

This date range picker plugin is under MIT LICENSE