DateTimeRanger is a jQuery plugin for fast visual and interactive date + time (range) entry.

Requires jQuery 1.7.0+ (MIT LICENSE), MomentJS 2.9.0+ (MIT LICENSE), DateRange-Picker-Ex 1.1.6+ (MIT LICENSE), TimeDropper-Ex 1.4.4+ (MIT LICENSE)

Compatible Browsers:

• Google Chrome 40+
• Mozilla Firefox 30+
• Microsoft Edge
• Microsoft Internet Explorer 10+
• Opera 25+
• Safari 5+

Supports multi-language, you can choose a pre-defined language or set it to auto-detect mode.
You can also define new languages, refer to the translations module for example.
Also, see documentations of DateRange-Picker-Ex and TimeDropper-Ex.

Easily customizeable colors and style to adopt to arbitrary theme.
Refer to the "Slate" delta CSS for example.
Also, see documentations of DateRange-Picker-Ex and TimeDropper-Ex

Installation

<link rel="stylesheet" type="text/css" href="timedropper.min.css" />
<link rel="stylesheet" type="text/css" href="daterangepicker.min.css" />
<link rel="stylesheet" type="text/css" href="dist/datetimeranger.min.css" />
<!-- Optional "Slate" color theme -->
<link rel="stylesheet" type="text/css" href="timedropper.slate.delta.min.css" />
<link rel="stylesheet" type="text/css" href="daterangepicker.slate.delta.min.css" />
<link rel="stylesheet" type="text/css" href="dist/datetimeranger.slate.delta.min.css" />
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript" src="moment.min.js"></script>
<script type="text/javascript" src="timedropper.min.js"></script>
<script type="text/javascript" src="timedropper.lang.min.js"></script>
<script type="text/javascript" src="daterangepicker.min.js"></script>
<script type="text/javascript" src="daterangepicker.lang.min.js"></script>
<script type="text/javascript" src="dist/datetimeranger.min.js"></script>
<script type="text/javascript" src="dist/datetimeranger.lang.min.js"></script>

Demonstrations