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

datepicker - initDate getting updated when navigating control #6636

Open
arcdev opened this issue Sep 23, 2017 · 3 comments
Open

datepicker - initDate getting updated when navigating control #6636

arcdev opened this issue Sep 23, 2017 · 3 comments

Comments

@arcdev
Copy link

arcdev commented Sep 23, 2017

The issues forum is NOT for support requests. It is for bugs and feature requests only.
Please read https://github.com/angular-ui/bootstrap/blob/master/CONTRIBUTING.md and search
existing issues (both open and closed) prior to opening any new issue and ensure you follow the instructions therein.

Bug description: As the user navigates the datepicker control, the initDate is updated. This causes issues if you use the the current date of one datepicker as the initDate of another.

Also, note how the Start Date control itself doesn't change, but the model value does.

Expected: initDate is essentially readonly.

Link to minimally-working plunker that reproduces the issue:

https://plnkr.co/edit/tvelT5r6ho59zcPzPvIH?p=preview

Steps to reproduce the issue:

As noted in the Plunker, simply navigate forward or backward by month in the End Date datepicker and note how the Start Date value changes.

Version of Angular, UIBS, and Bootstrap

Angular: 1.6.1

UIBS: 2.5.0

Bootstrap: 3.3.7

@arcdev
Copy link
Author

arcdev commented Sep 23, 2017

It seems the root cause is that activeDate is set to initDate and since this is a reference type object (Date), any updates to activeDate also update initDate. And if initDate is the scope/model value of another control, then that other control's scope/model value is also updated.

Maybe because it's a reference type the other control doesn't get a watch fired?

@arcdev
Copy link
Author

arcdev commented Sep 24, 2017

I might recommend changing the init method to this:

  this.init = function(ngModelCtrl_) {
    ngModelCtrl = ngModelCtrl_;
    ngModelOptions = extractOptions(ngModelCtrl);

    if ($scope.datepickerOptions.initDate) {
      var newInitDate = dateParser.fromTimezone($scope.datepickerOptions.initDate, ngModelOptions.getOption('timezone')) || new Date();
      self.activeDate = angular.isDate(newInitDate) ? new Date(newInitDate.getTime()) : newInitDate;
      $scope.$watch('datepickerOptions.initDate', function(initDate) {
        if (initDate && (ngModelCtrl.$isEmpty(ngModelCtrl.$modelValue) || ngModelCtrl.$invalid)) {
          var updatedInitDate = dateParser.fromTimezone(initDate, ngModelOptions.getOption('timezone'));
          self.activeDate = angular.isDate(updatedInitDate) ? new Date(updatedInitDate.getTime()) : updatedInitDate;
          self.refreshView();
        }
      });
    } else {
      self.activeDate = new Date();
    }

    var date = ngModelCtrl.$modelValue ? new Date(ngModelCtrl.$modelValue) : new Date();
    this.activeDate = !isNaN(date) ?
      dateParser.fromTimezone(date, ngModelOptions.getOption('timezone')) :
      dateParser.fromTimezone(new Date(), ngModelOptions.getOption('timezone'));

    ngModelCtrl.$render = function() {
      self.render();
    };
  };

That way activeDate is always a copy rather than a reference.

@arcdev
Copy link
Author

arcdev commented Sep 26, 2017

check out pull request #6638

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant