Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

fix(datepicker): lag on datepicker in a modal re-alignment after scrolling #2993

Closed
JimJafar opened this issue Nov 8, 2017 · 7 comments
Closed

fix(datepicker): lag on datepicker in a modal re-alignment after scrolling #2993

JimJafar opened this issue Nov 8, 2017 · 7 comments
Labels
comp(datepicker) comp(positioning) effort2: medium (days) issue

Comments

@JimJafar
Copy link

JimJafar commented Nov 8, 2017

Bug description or feature request:

If you have a datepicker in a modal, and then scroll the modal the datepicker is left behind. After a long pause (maybe 10 seconds), the datepicker will jump back to the input. If you click the datepicker that also causes it to jump to the input.

Versions of ngx-bootstrap, Angular, and Bootstrap:

ngx-bootstrap: 1.9.3

Angular: 4.3.2

Bootstrap: bootstrap-sass 3.3.7

Build system: Angular CLI, System.js, webpack, starter seed:

Webpack
yo angular2-typescript generator version 0.8.1.
@valorkin
Copy link
Member

Any pop-ups elemens has reposition on zone stable event, with ngv4 I will try to rewrite positioning, to work outside zone at all

@jamessawyer
Copy link

+1 some issue, it seems 'this._ngZone.onStable.subscribe(() =>{})' keeps ticking.

@YevheniiaMazur YevheniiaMazur changed the title lag on datepicker re-alignment after scrolling in a modal fix(datepicker): lag on datepicker in a modal re-alignment after scrolling Jan 17, 2018
@EvilAlexei EvilAlexei mentioned this issue Jan 17, 2018
Closed
61 tasks
@masonwheeler
Copy link

This isn't just limited to popups; it seems to affect all scrolling. I've got a scenario where opening a ModalDirective adds over 30 handlers to the window's scroll event, which don't get removed when you close the modal, causing severe lag when scrolling.

They do get removed when navigating away from the page, but until that point, we have what ought to be considered a resource leak. If these handlers are needed for the modal, then calling hide() on the modal, or any other method of removing it from view, should unload them.

@Domainv Domainv mentioned this issue Jan 30, 2019
Merged
5 tasks
valorkin pushed a commit that referenced this issue Feb 8, 2019
@Domainv @valorkin
feat(positioning): refactor positioning service (#5027)
66ae92d 
* reafctor(positioning): add popper.js and migrate it to typescript

* temporary disable tslint for popper

* feat(position): refactored base functionality

* update

* feat(positioning): flip on overflow added (dirty)

* refactor(positioning): add logic of arrow position correcting

* refactor(positioning): add shift logic. placement: bottom left/bottom right

* refactor(positioning): refactor logic of real-time processing events to avoid memory leaks

* refactor(positioning): add types for all methods(minimal solution) && fix tslint errors

* refactor(positioning): optimize and fix blur text on tooltip/popover

* refactor(positioning): add auto class placement

* refactor(positioning): clean up the code

* refactor(positioning): unit tests are fixed

* refactor(positioning): fix incorrect styles on bootstrap 3 && fix arrow in popovers when auto

* refactor(positioning): fix tests for sauce

* refactor(positioning): fix typeahead dropup issue

* refactor(positioning): fix center for arrow on shift

* refactor(positioning): fix tooltip out of screen on mobile

* refactor(positioning): refactor modifiers flow

* fix(tooltip): back css style

Closes #3303
Closes #2993
Closes #4470
@raideltorres
Copy link

This was marked as solved but is already deployed ? I'm using 3.3.0 but still having the same issue and this is not happening only in a modal. Please I really need this.

@raideltorres
Copy link

Moved to 4.1.1 and still same issue.

leo6104 pushed a commit to leo6104/ngx-bootstrap that referenced this issue Oct 10, 2019
@Domainv @leo6104
feat(positioning): refactor positioning service (valor-software#5027)
ec833da 
* reafctor(positioning): add popper.js and migrate it to typescript

* temporary disable tslint for popper

* feat(position): refactored base functionality

* update

* feat(positioning): flip on overflow added (dirty)

* refactor(positioning): add logic of arrow position correcting

* refactor(positioning): add shift logic. placement: bottom left/bottom right

* refactor(positioning): refactor logic of real-time processing events to avoid memory leaks

* refactor(positioning): add types for all methods(minimal solution) && fix tslint errors

* refactor(positioning): optimize and fix blur text on tooltip/popover

* refactor(positioning): add auto class placement

* refactor(positioning): clean up the code

* refactor(positioning): unit tests are fixed

* refactor(positioning): fix incorrect styles on bootstrap 3 && fix arrow in popovers when auto

* refactor(positioning): fix tests for sauce

* refactor(positioning): fix typeahead dropup issue

* refactor(positioning): fix center for arrow on shift

* refactor(positioning): fix tooltip out of screen on mobile

* refactor(positioning): refactor modifiers flow

* fix(tooltip): back css style

Closes valor-software#3303
Closes valor-software#2993
Closes valor-software#4470
IraErshova pushed a commit to IraErshova/ngx-bootstrap that referenced this issue Jan 20, 2020
@Domainv @IraErshova
feat(positioning): refactor positioning service (valor-software#5027)
870cb6d 
* reafctor(positioning): add popper.js and migrate it to typescript

* temporary disable tslint for popper

* feat(position): refactored base functionality

* update

* feat(positioning): flip on overflow added (dirty)

* refactor(positioning): add logic of arrow position correcting

* refactor(positioning): add shift logic. placement: bottom left/bottom right

* refactor(positioning): refactor logic of real-time processing events to avoid memory leaks

* refactor(positioning): add types for all methods(minimal solution) && fix tslint errors

* refactor(positioning): optimize and fix blur text on tooltip/popover

* refactor(positioning): add auto class placement

* refactor(positioning): clean up the code

* refactor(positioning): unit tests are fixed

* refactor(positioning): fix incorrect styles on bootstrap 3 && fix arrow in popovers when auto

* refactor(positioning): fix tests for sauce

* refactor(positioning): fix typeahead dropup issue

* refactor(positioning): fix center for arrow on shift

* refactor(positioning): fix tooltip out of screen on mobile

* refactor(positioning): refactor modifiers flow

* fix(tooltip): back css style

Closes valor-software#3303
Closes valor-software#2993
Closes valor-software#4470
@agroves333
Copy link

This is still an issue. There is a nasty ~1s lag between scrolling and the datepicker jumping to the new scroll location.

@sireeshap
Copy link

i am using "ngx-bootstrap": "^5.6.1", still i am facing this issue. date picker panel is moving while scrolling and not staying with text input box.

@sireeshap sireeshap mentioned this issue Aug 15, 2020
Open
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
comp(datepicker) comp(positioning) effort2: medium (days) issue
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
9 participants
@JimJafar @valorkin @agroves333 @masonwheeler @sireeshap @raideltorres @IlyaSurmay @jamessawyer @YevheniiaMazur