Keyboard Driven Date & Time Input Plugin With jQuery - datetime.js

Keyboard Driven Date & Time Input Plugin With jQuery - datetime.js
File Size: 127 KB
Views Total:
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   

datetime.js is a jQuery date selector plugin used to create user-friendly, keyboard-driven, multi-language date & time inputs. 

How to use it:

1. Load the latest version of jQuery library and the jQuery datetime.js script in your webpage.

<script src="//code.jquery.com/jquery-3.1.1.slim.min.js"></script>
<script src="dist/datetime.js"></script>

2. Create a normal text field for the date & time input.

<input type="text" id="basic">

3. Just call the function on the input field and done.

$('#basic').datetime()

4. Customize the datetime format.

// yy: 2-digit year  dd.M.yy 05.03.17
// yyyy  4-digits yeaar  dd.M.yyyy 05.03.2017
// M 2-digits month  dd.M.yyyy 05.03.2017
// MM  short month   dd MM yyy 05 сент. 2017 
// MMM 1-letter month  dd MMM yyyy 05 C 2017 
// MMMM  full month name dd MMMM yyyy  05 январь 2017
// L Stand-Alone month name  dd L yyyy 05 января 2017
// d 1-digit day d L yyyy  5 января 2017
// dd   2-digit day  dd L yyyy 05 января 2017
// EE   short weekday  EE dd L yyyy  чт 05 января 2017
// EEE  1-letter weekday EEE dd L yyyy Ч 5 января 2017
// EEEE   full weekday  EEEE dd L yyyy четверг 5 января 2017
// h 1-digi hour in 12 hours format   h:mm:ss  8:15:33 
// hh  2-digits hour in 12 hours format   hh:mm:ss 08:15:33 
// H 1-digit hour in 24 hours format    H:mm:ss  8:15:33
// HH  2-digit hour in 24 hours format    HH:mm:ss 08:15:33
// m 1-digit minute   hh:m:ss  08:1:03 
// mm  2-digit minute  hh:mm:ss  08:01:03 
// s 1-digit second  hh:mm:s   08:01:3
// ss  2-digit second  hh:mm:ss  08:01:03 
// a  AM/PM  hh:mm:ss a  08:01:03 AM

$('#basic').datetime({
  format:  'dd MMMM yyyy HH:mm a'
})

5. Set the current/max/min date & time.

$('#basic').datetime({
  datetime: NaN,
  minDate: NaN,
  maxDate: NaN,
  minTime: NaN,
  maxTime: NaN
})

Change log:

v1.1.8 (2017-03-28)

  • Fixed: Cannot enter numeric values

v1.1.4 (2017-03-12)

  • bugfix

This awesome jQuery plugin is developed by ua9msn. For more Advanced Usages, please check the demo page or visit the official website.