From 5c61c8ac02faa27d218026ca44b68ff55c8189b1 Mon Sep 17 00:00:00 2001 From: crisbeto Date: Sun, 14 Aug 2016 18:08:43 +0300 Subject: [PATCH] fix(datepicker): jumping forward if min date is in the same month as model Fixes the datepicker jumping forward if the current month is also the first one being rendered (e.g. when the min date is in the same month as the model). This was caused by an extra unnecessary call to `generateContent` which made the first month in the calendar to be re-rendered at the bottom after the user has scrolled past it. When the first month is at the bottom, the calendar tries to focus the active date, causing the browser to scroll to the bottom. Afterward the virtual repeater updates the view again, which makes the calendar skip a few months. Fixes #9284. --- src/components/datepicker/js/calendarMonthBody.js | 6 +++--- src/components/datepicker/js/calendarYearBody.js | 8 ++++---- 2 files changed, 7 insertions(+), 7 deletions(-) diff --git a/src/components/datepicker/js/calendarMonthBody.js b/src/components/datepicker/js/calendarMonthBody.js index db993d4a9e..965ac52d95 100644 --- a/src/components/datepicker/js/calendarMonthBody.js +++ b/src/components/datepicker/js/calendarMonthBody.js @@ -28,7 +28,6 @@ monthBodyCtrl.calendarCtrl = calendarCtrl; monthBodyCtrl.monthCtrl = monthCtrl; monthBodyCtrl.arrowIcon = ARROW_ICON.cloneNode(true); - monthBodyCtrl.generateContent(); // The virtual-repeat re-uses the same DOM elements, so there are only a limited number // of repeated items that are linked, and then those elements have their bindings updated. @@ -81,8 +80,9 @@ CalendarMonthBodyCtrl.prototype.generateContent = function() { var date = this.dateUtil.incrementMonths(this.monthCtrl.firstRenderableDate, this.offset); - this.$element.empty(); - this.$element.append(this.buildCalendarForMonth(date)); + this.$element + .empty() + .append(this.buildCalendarForMonth(date)); if (this.focusAfterAppend) { this.focusAfterAppend.classList.add(this.calendarCtrl.FOCUSED_DATE_CLASS); diff --git a/src/components/datepicker/js/calendarYearBody.js b/src/components/datepicker/js/calendarYearBody.js index 28b6328881..acef6cf0e8 100644 --- a/src/components/datepicker/js/calendarYearBody.js +++ b/src/components/datepicker/js/calendarYearBody.js @@ -22,10 +22,9 @@ yearBodyCtrl.calendarCtrl = calendarCtrl; yearBodyCtrl.yearCtrl = yearCtrl; - yearBodyCtrl.generateContent(); scope.$watch(function() { return yearBodyCtrl.offset; }, function(offset, oldOffset) { - if (offset != oldOffset) { + if (offset !== oldOffset) { yearBodyCtrl.generateContent(); } }); @@ -71,8 +70,9 @@ CalendarYearBodyCtrl.prototype.generateContent = function() { var date = this.dateUtil.incrementYears(this.yearCtrl.firstRenderableDate, this.offset); - this.$element.empty(); - this.$element.append(this.buildCalendarForYear(date)); + this.$element + .empty() + .append(this.buildCalendarForYear(date)); if (this.focusAfterAppend) { this.focusAfterAppend.classList.add(this.calendarCtrl.FOCUSED_DATE_CLASS);