Date range picker for Bootstrap

A JavaScript (jQuery) component for choosing date ranges in web UI. High quality, date range picker, designed to work with the Bootstrap CSS framework.

JavaScript and Bootstrap date range picker solution

This date and time picker component for creates a stunning dropdown menu, from which a user can select a range of dates. A great way to select date ranges, for reports, stats or other kind of web software.

Features include limiting the selectable date range, localizable strings and date formats, a single date picker mode, optional time picker (for e.g. making appointments or reservations).

Date range picker solution
Date range picker solution

Usage

A simple example of Date range picker. The Date Range Picker is attached to a text input. It will use the current value of the input to initialize, and update the input if new dates are chosen.

<input type="text" name="daterange" value="01/01/2015 - 01/31/2015" />

<script type="text/javascript">
$(function() {
    $('input[name="daterange"]').daterangepicker();
});
</script>

Simple and working very well.

Some more advanced demo you can find here.

License: MIT

Homepage:

http://www.daterangepicker.com

Download from GitHub:

https://github.com/dangrossman/bootstrap-daterangepicker

You may also like:

Other resources from Date, time & clock category

Tutorial: Date and Time in JavaScript

jQuery UI DateRangePicker

Do you know other, similar solutions? Please share in comment.

Thank you for you attention.

Share:Share on Facebook2Share on Google+1Tweet about this on TwitterShare on LinkedIn1Pin on Pinterest2