angular-bootstrap3-datepicker

A AngularJS directives for the bootstrap3-datepicker

##New maintainer

I'm looking for someone willing to help on this. Obviously there is not much to do, but still it require some attention. Feel free to contact me in any way if your interested in this.

Demo

Here's a working jsfiddle Look here for more information about the original jquery-plugin and more demo.

Installation

Installation is easy, jQuery, momentjs, font-awesome, AngularJS and Bootstrap's JS/CSS are required. You can download angular-bootstrap-datepicker via bower: bower install angular-bootstrap3-datepicker

When you are done downloading all the dependencies and project files the only remaining part is to add dependencies as an AngularJS module:

angular.module('myModule', ['ng-bs3-datepicker']);

You also need to include these files:

<link rel="stylesheet" href="bootstrap/css/bootstrap.css" />
<link rel="stylesheet" href="font-awesome.css" />
<link rel="stylesheet" href="ng-bs3-datepicker.css" />


<script src="jquery.js"></script>
<script src="bootstrap/js/bootstrap.js"></script>
<script src="angular.js"></script>
<script src="moment.js"></script>
<script src="moment-your-locale.js"></script>
<script src="ng-bs3-datepicker.js" charset="utf-8"></script>

Make sure you use charset="utf-8" in your script tag if your browser (or those of your users) is displaying characters wrong when using another language.

Settings

To use the directive, use the following code :

<ng-bs3-datepicker ng-model="date" language="en" date-format="YYYY-MM-DD">

datepicker : Indicates you want a date picker

language : The locale you want to use for this date picker. To work, this require adding the corresponding momentjs locale file.

ng-model : Variable of the controller scope to store the date. The date is currently store as a string, formatted according to date format.

date-format: Format to use to format the date. The correct definition can be found here

For a working example, see http://jsfiddle.net/benzen/46E2E/

Thanks to

• cletourneau: https://github.com/cletourneau
• Eonasdan: https://github.com/Eonasdan/bootstrap-datetimepicker