Simple Date Picker For jQuery and AngularJS - Datepicker

File Size: 7.63 KB
Views Total: 20380
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
Simple Date Picker For jQuery and AngularJS - Datepicker

A simple lightweight jQuery plugin that appends a nice clean date picker component to your input box using moment.js. Also provided as a datepicker module for AngularJS.

How to use it:

1. Load the necessary jQuery library or Angular.js in your document.

<script src="//"></script>
<!-- or -->
<script src="//"></script>

2. Load the moment.js and the Datepicker's files in the document.

<link href="src/datepicker.css" rel="stylesheet">
<script src="//"></script>
<script src="src/datepicker.js"></script>

3. Use the datepicker component as a jQuery plugin.


4. Use the datepicker component as an Angularjs module.

<input id="angular-demo" type="text" 
       data-datepicker="{theme: 'flat'}" 
angular.module('SELECTOR', ['datepicker'])
  .controller('datepicker.controller', ['$scope', function($scope) {
    $scope.value1 = "14.04.2016";
    $ = moment().toDate();

4. Default options.

initial_value: null,
dateformat: 'DD.MM.YYYY',
placeholder: $element.attr('placeholder') || '',
theme: 'basic', // basic or flat
readonly: true,
vertical_offset: 3,
is_invalid_date: null

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