Dialog/DynamicDialog: Overlay dropdown moving with page while scrolling outside of dropdown.

[kkoripl]

Describe the bug

When overlay component with a possible dropdown (like autoComplete or dropdown itself) apended to 'body' is opened in the dialog, while page behind the dialog has scroll, the dropdown moves with a page, leaving the input in its original place.

One can see that at demo page for p-dialog: https://primeng.org/dialog at 'Overlays Inside' part.
I've reproduced exact same problem for dynamic dialog locally.

Environment

Windows 10
Primeng v16.9.2-lts + Angular: v16.2.12

Reproducer

https://primeng.org/dialog

Angular version

16.2.12

PrimeNG version

16.9.2-lts

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

18.6.0+

Browser(s)

No response

Steps to reproduce the behavior

1. Go to: https://primeng.org/dialog
2. Open dialog at 'Overlays Inside'
3. Open cities dropdown by mouse click.
4. Scroll up and down outside the dropdown.

Expected behavior

The dropdown stays connected to input while the page is scrolled.

[mertsincan]

Hi,

You can use appendTo prop for this case and set p-dialog element to it.

Best Regards,