I am having a problem in datepicker with ng-change. The ng-change event is not firing when I change the value by "clicking the date" but working when I change the value by "typing the date".

Here's my code.

<input ng-change="date_change();" ng-model="date_to" id="recon-date" name= "date_to" type="text" class="form-control" date-time view="month" auto-close="true" min-view="month" format="MM-DD-YYYY">

I trace the problem by investigating the datepicker.js. I found out (if I'm correct) that the ngModelController.serViewValue() and $render() is not firing the ng-change.

I tried to add scope.$apply() but no luck. I am debugging this for hours and still no progress.

P.S. I don't want to use $scope.$watch() to solve this problem.

Thankss!!

I am having a problem in datepicker with ng-change. The ng-change event is not firing when I change the value by "clicking the date" but working when I change the value by "typing the date".

Here's my code.

<input ng-change="date_change();" ng-model="date_to" id="recon-date" name= "date_to" type="text" class="form-control" date-time view="month" auto-close="true" min-view="month" format="MM-DD-YYYY">

I trace the problem by investigating the datepicker.js. I found out (if I'm correct) that the ngModelController.serViewValue() and $render() is not firing the ng-change.

I tried to add scope.$apply() but no luck. I am debugging this for hours and still no progress.

P.S. I don't want to use $scope.$watch() to solve this problem.

Thankss!!

• javascript
• angularjs

• Possible duplicate of angularjs timepicker ng-change – Naghaveer R Commented Feb 19, 2017 at 5:00
• Thanks but I dont want to use $watch event. I have so many date with ngchange and dont want to create $watch in every single one of them. – aldesabido Commented Feb 19, 2017 at 5:33
• Try to use md-datepicker or angular-datepicker.js instead of datepicker.js – Naghaveer R Commented Feb 19, 2017 at 5:46
• Gonna try that. Thanks. – aldesabido Commented Feb 19, 2017 at 8:36

3 Answers 3

Without ng-change, use a watch

$scope.date_to;

$scope.$watch("date_to", function(newValue, oldValue) {
    console.log("I've changed : ", to date);
});

Use $apply, May this will help you.

var scope=angular.element($('#recon-date')).scope();    
scope.$apply(); 

Use this onchange="angular.element(this).scope().photoChange(this)" instead of this ng-change="photoChange(this)"