Yet Another jQuery Date & Time Picker Plugin - filthypillow

File Size: 94.3 KB
Views Total: 7257
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Yet Another jQuery Date & Time Picker Plugin - filthypillow

filthypillow is yet another jQuery plugin for calendar and date-time picker, features html template, shortcut keys, custom time zone, selection steps, and events & API support. Please note that the plugin requires moment.js for parsing, validating, manipulating, and formatting dates.

Basic Usage:

1. Include jQuery javascript library and required moment.js library on your web page.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript" src="libs/moment.js"></script>

2. Include jQuery filthypillow plugin files on the web page.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript" src="./libs/moment.js"></script>

3. Create an input field that will popup a time-date picker when on focus.

<input class="filthypillow-demo" />

4. The javascript.

<script>
var $fp = $( ".filthypillow-demo" );

$fp.filthypillow( {
minDateTime: function( ) {
return moment( ); //now
}   
} );
$fp.on( "focus", function( ) {
    $fp.filthypillow( "show" );
    } );
$fp.on( "fp:save", function( e, dateObj ) {
    $fp.val( dateObj.format( "MMM DD YYYY hh:mm A" ) );
    $fp.filthypillow( "hide" );
    } );                                                    
</script>

5. Prototypes.

currentStep: null,
dateTime: null,
currentTimeZone: null, //null is browser default
currentDigit: 0, //first or second digit for key press
isActiveLeadingZero: 0, //user types in 0 as first digit
steps: [ "month", "day", "hour", "minute", "meridiem" ], 
stepRegExp: null,
isError: false, //error is being shown
isActive: false, //whether the calendar is active or not

6. Options.

startStep: "day", // month, day, hour, minute, meridiem
minDateTime: null, // //function returns moment obj
maxDateTime: null, //function returns moment obj
initialDateTime: null //function returns moment obj

Change logs:

v1.5.0 (2016-02-27)

  • update

v1.4.0 (2015-10-15)

  • bugs fixed.

v1.3.2 (2015-09-09)

  • bugs fixed.

v1.3.1 (2014-09-09)

  • bugs fixed.

v1.2.2 (2014-09-02)

  • bugs fixed.

v1.2.0 (2014-01-29)

  • bugs fixed.

v1.0.0 (2014-01-16)

  • bugs fixed.

v0.0.2 (2013-11-28)

  • Some minor fixes and refactoring to min/max ranges

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