Skip to content

Instantly share code, notes, and snippets.

@mwadams
Forked from eugenekgn/datetimepickerDirective.js
Last active May 1, 2019 14:03
Show Gist options
  • Save mwadams/3a950170ec0636fa1036 to your computer and use it in GitHub Desktop.
Save mwadams/3a950170ec0636fa1036 to your computer and use it in GitHub Desktop.
'use strict';
angular
.module('datetimepicker', [])
.provider('datetimepicker', function () {
var default_options = {};
this.setOptions = function (options) {
default_options = options;
};
this.$get = function () {
return {
getOptions: function () {
return default_options;
}
};
};
})
.directive('datetimepicker', [
'$timeout',
'datetimepicker',
function ($timeout,
datetimepicker) {
var default_options = datetimepicker.getOptions();
return {
require: '?ngModel',
restrict: 'AE',
scope: {
datetimepickerOptions: '@'
},
link: function ($scope, $element, $attrs, controller) {
var passed_in_options = $scope.$eval($attrs.datetimepickerOptions);
var options = jQuery.extend({}, default_options, passed_in_options);
$element.on('dp.change', function (ev) {
$timeout(function () {
var dtp = $element.data("DateTimePicker");
controller.$setViewValue(dtp.date());
});
});
function setPickerValue() {
var result = null;
if (!!controller && !!controller.$viewValue) {
result = controller.$viewValue;
}
var dtp = $element.data("DateTimePicker");
dtp.date(result);
}
controller.$render = function (value) {
setPickerValue();
};
$element.datetimepicker(options);
setPickerValue();
}
};
}
]);
Copy link

ghost commented Apr 27, 2015

I'm getting TypeError: $element.datetimepicker is not a function at line 59,

I do have an $element var, so angular is finding it on the dom, the function just isn't attached.

Thoughts?

it appears loaded in my index.html

@atais
Copy link

atais commented Oct 16, 2015

Great solution, why dont you pull request to https://github.com/diosney/angular-bootstrap-datetimepicker-directive?

@maaroarg
Copy link

Thanks! This is the only directive I've found that accepts two-way binding. Works Great!

@rupertbear
Copy link

Thanks for the efforts with this. Perhaps I've misunderstood something but if you change the format to MM/YYYY it displays correctly but the variable contains a full time stamp. My testing shows, for instance, when I set the picker to August 2016 the display shows 08/2016 correctly but the ng-model value contains 2016-07-31T23:00:00.000Z" which does not match the picked value.

Have attempted to fix myself but being a bit of an Anuglar newb I'm struggling. If anyone has any thoughts they'd be greatly received!

@rupertbear
Copy link

Got it. I think...

CHANGE:
controller.$setViewValue(dtp.date());
To:
controller.$setViewValue(dtp.date().format(options.format));

@niteshvirani
Copy link

Thanks! Works Great!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment