smartDate Input – a jQuery plugin
A jQuery plugin that understands human date/time inputs & their format
Download / Installation
You can download the latest JS code here:
Simply add it to your HTML page, make sure to load jQuery, moment and moment-parseformat
<script src="jquery.js"></script><script src="moment.js"></script><script src="moment.parseFormat.js"></script><script src="smartdat-input.js"></script><!-- $('input').smartDate() is now available -->
Or install via npm
npm install --save expandable-input
The JS code can be required with
var jQuery = var moment = momentparseFormat = var expandableInput = // init// $('input').smartDate() is now available
Usage
var $input = ; // initialize$input; // set value to Date$input; // set/change format$input; // also possible:$input // listen to format changes$input; // listen to changes of the parsed timestamp$input; // per default, change:format & change:timestamp will be checked for// and triggered on blur. This can be changed with the setEvent method$input;
You can make the data input self-initializing by using the data-api. The input will be initialized on first interaction.
<input data-smartdate-spy>
You can also set the default date format:
<input data-smartdate-spy data-format="MMM Do, YYYY">
Or the event when it shall check for & trigger change:format
<input data-smartdate-spy data-format-event="input">
Setup
git clone git@github.com:gr2m/smartdate-input.gitcd smartdate-inputnpm install
Test
npm test
While working on the tests, you can start Selenium / Chrome driver once, and then tests re-run on each save
npm run test:mocha:watch
Test configuration
Set log level (silly
, verbose
, info
, warn
, error
). Defaults to error
LOG_LEVEL=verbose npm test
Running tests in a different browser. Defaults to selenium:chrome
CLIENT=selenium:firefox npm test
Running tests on Sauce Labs
# a couple of examples SAUCELABS_USERNAME=username SAUCELABS_ACCESS_KEY=accesskey CLIENT=saucelabs:chrome npm testSAUCELABS_USERNAME=username SAUCELABS_ACCESS_KEY=accesskey CLIENT='saucelabs:internet explorer' npm testSAUCELABS_USERNAME=username SAUCELABS_ACCESS_KEY=accesskey CLIENT='saucelabs:internet explorer:10.0:Windows 8' npm test
Fine Print
The smartDate Input Plugin have been authored by Gregor Martynus (@gr2m), proud member of the Hoodie Community.
License: MIT