CODEWITHSUNDEEP
cssangularangular5contextmenuprimeng
futureExpert
futureExpert

Reputation: 55

Angular5 PrimeNG Datatable on a Modal with ContextMenu showing up behind the modal

enter image description here

I have a modal window that contains a PrimeNG Datatable enabled with ContextMenu. The problem is that when I right click one of the table rows, my right click context menu is behind the modal window. I've added appendTo="body" but that did not help except for correct positioning. The main problem now is that the context menu has a z-index that is BEHIND the modal.

I have tried explicitly setting the z-index but could not override the dynamically generated CSS that is applied to the context menu with every right click.

Any ideas, please?

Upvotes: 1

Views: 1340

Answers (1)

Abhinav Kumar
Abhinav Kumar

Reputation: 3036

You can set the base z-index property of the context menu.

<p-contextMenu #cm [model]="items" appendTo="body" baseZIndex="99999"></p-contextMenu>

here is stackblitz implementation

Upvotes: 1

Related Questions