Skip to content
This repository was archived by the owner on May 29, 2019. It is now read-only.

bug(datepicker): doesn't fire ng-change events #612

Closed
ostronom opened this issue Jul 2, 2013 · 13 comments
Closed

bug(datepicker): doesn't fire ng-change events #612

ostronom opened this issue Jul 2, 2013 · 13 comments

Comments

@ostronom
Copy link

ostronom commented Jul 2, 2013

I have an issue with ng-change and datepicker directive. In this piece of code:

<...ng-repeat="p in props"...>
   <div datepicker ng-model="p.value" ng-change="myScopeFunction()"></div>
<...>

myScopeFunction is never called.

@pkozlowski-opensource
Copy link
Member

Oh, I see... @bekos we should probably consider plugging into the NgModelController instead of binding directly to the model The advantage of the NgModelController is that we can plug into the existing parsing / formatting pipelines and have validation etc.

@bekos
Copy link
Contributor

bekos commented Jul 3, 2013

@pkozlowski-opensource I agree that this would be the best practice, but I am not sure how this could work with an isolated scope. I will look into this.

@bekos
Copy link
Contributor

bekos commented Jul 5, 2013

@pkozlowski-opensource There is an open issue for isolated-scope and ngmodelcontroller in AngularJS, so I don't think we can do many things atm.

Probably, a solution is to add a onSelect callback to let the user hook to the date selection, rather than watching the model for changes. WDYT?

@pkozlowski-opensource
Copy link
Member

@bekos was just updating this issue :-) So, there is no real "issue" of isolated scopes and ngModel - it is just that in the current version of AngularJS a given DOM element is associated with one and only one scope. I agree that this is a pain but there are ways out. In the typeahead directive I'm creating an isolated scope for popup matches and manually evaluate expressions against a proper scope.

I'm not saying that this is what we should be doing for the date-picker directive but we will have to find a solution if we want it to work with inputs. Plugging into ngModel will be necessary to support custom date formats.

Anyway, I agree that this is not a trivial topic, especially if we want to combine it with a popover. But hey, we are AngularJS masters, got AngularJS commiters in the team and can ask for help from the core team. So I'm sure that we will find a good solution!

I would be really keen on seeing datapicker integrated with popovers / inputs and I can help with design issues / reviewing code etc. On my side I would like to finish $dialog rewrites. Also we should try to fix existing bugs as to prepare for AngularJS 1.2 / Bootstrap 3.0 migration.

bekos added a commit that referenced this issue Aug 4, 2013
 * `ngModelController` integration
 * `datepikcerPopup` directive ti use with inputs
 * invalid & disabled validation
 * add `min` / `max` into configuration

Closes #612
bekos added a commit to bekos/bootstrap that referenced this issue Aug 4, 2013
 * `ngModelController` integration
 * `datepikcerPopup` directive ti use with inputs
 * invalid & disabled validation
 * add `min` / `max` into configuration

Closes angular-ui#612
@bekos bekos closed this as completed in dab1833 Aug 4, 2013
@marcosjunqueira
Copy link

Help me with this http://plnkr.co/edit/WBt1BGAqBnecEdv1jqfu?p=preview
1 - Select a service
2 - Select a date
Date model not update and console log undefined value

@johntom
Copy link

johntom commented May 18, 2014

simple solution to pass vaule
html
ng-change="selectDate(dt)"

js
$scope.selectDate = function(dt) {
console.log(dt);

}

@vishwajeetv
Copy link

@johntom Thanks, it worked for me (after debugging this for 3 hours)
@bekos You should update the documentation by this.

@cesarvega
Copy link

simple solution to pass vaule
html
ng-change="selectDate(dt)"

js
$scope.selectDate = function(dt) {
console.log(dt);

} this is the best answer

@dev-mjoy
Copy link

dev-mjoy commented Apr 8, 2015

@johntom I nearly went through 7 hrs searching and finally got this small magic 👍 ,Thanks a Lot!

@kris8889
Copy link

Hi,
I have tried this solution

html
ng-change="selectDate(dt)"

js
$scope.selectDate = function(dt) {
console.log(dt);
}
but still not able to hit the event . Can anyone please post a plunkr link of this ?

Thanks in advance.

@dev-mjoy
Copy link

@kris8889 here is the link-- http://plnkr.co/edit/rbB3nf?p=preview
[i have used moment js for parsing data.]

@blacksmoke26
Copy link

@johntom Thank you, solved my problem too.

@hmudassir
Copy link

I am facing on ng-change issue. I am using dynamic datetime-picker. date is showing in ng-model but ng-change not firing. Please help.........

# for free to subscribe to this conversation on GitHub. Already have an account? #.
Projects
None yet
Development

No branches or pull requests