Dialog z-index PrimeReact2

UI Components for React
Post Reply
Posts: 17
Joined: 18 Sep 2018, 13:04

11 Oct 2018, 10:40


There seems to be an issue with the z-index of the dialogs.

Every click in the body of the dialog increases the z-index of all dialogs by 1, this results in issues with opening other overlays from the dialog (Appending the new dialog to the body does not help, see example below).

For example if you want to open a modal dialog from a normal dialog.
The normal dialog will appear on top again after clicking in the body of the modal dialog:

Also MultiSelects, Dropdowns, ... (appended to the body to avoid dialog scrolling) do not work correctly (after clicking on them the dialog is shown above) in an dialog because of this issue.

I am using the "2.0.0-beta.9" version.

Thanks for looking into this issue.

Posts: 10
Joined: 06 Oct 2018, 06:03

13 Oct 2018, 08:54

Hi @stfabian,

We have the same issue. We created github issue. You might follow : https://github.com/primefaces/primereact/issues/596

Have a nice day,

Posts: 17
Joined: 18 Sep 2018, 13:04

23 Oct 2018, 13:17

There is also an issue with the lightbox in an modal dialog.

The full image is shown behind the mask:


Posts: 18298
Joined: 05 Jan 2009, 00:21
Location: Cybertron

24 Oct 2018, 18:10

Overlays inside overlays are problematic in general, the inner one must have appendTo body for sure, we're investigating the z-index layering issue now.

Posts: 10
Joined: 06 Oct 2018, 06:03

25 Oct 2018, 15:09

Thank you!

Posts: 6
Joined: 18 Sep 2019, 10:51

29 Oct 2019, 07:47

I got a the same problem to this. there seems to be a problem when lightbox component is used in a dialog/modal. are there any updates to this problem?

Posts: 5
Joined: 09 Oct 2019, 16:52

04 Nov 2019, 10:46

This seems not solved yet?

Post Reply

Return to “PrimeReact”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 1 guest