I've seen a variety of github directive examples, but none include a working JSFiddle and I've not been able to get any of them to work. Surprised this isn't in Angular-UI by this point.
Because you're defining the code in the head the body and its contents haven't been loaded yet; so the selector finds no elements to initialize datepicker. If you don't want to use document. ready functionality you could also move the script to the end of the body tag.
You have to use . show() method to keep your dateTimePicker visible, note that all the DateTimePicker's functions are reachable via the data attribute e.g.
Java Script: var datePicker = angular. module('app', []); datePicker. directive('datepicker', function () { return { restrict: 'C', require: 'ngModel', link: function (scope, element, attrs, ngModelCtrl) { element. datepicker({ dateFormat: 'dd, MM, yy', onSelect: function (date) { scope.
please see this directive, a working calendar fiddle: http://jsfiddle.net/nabeezy/HB7LU/209/
myApp.directive('calendar', function () { return { require: 'ngModel', link: function (scope, el, attr, ngModel) { $(el).datepicker({ dateFormat: 'yy-mm-dd', onSelect: function (dateText) { scope.$apply(function () { ngModel.$setViewValue(dateText); }); } }); } }; })
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With