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

Component: Pick List #13513

Closed
leoncydsilva opened this issue Aug 18, 2023 · 4 comments · Fixed by #13515
Closed

Component: Pick List #13513

leoncydsilva opened this issue Aug 18, 2023 · 4 comments · Fixed by #13515
Labels
LTS-PORTABLE Type: Bug Issue contains a bug related to a specific component. Something about the component is not working
Milestone
16.3.0

Comments

@leoncydsilva
Copy link
Contributor

Describe the bug

If PickList component is used in Dynamic Dialog, when dragging the items from source or target the items goes behind the dialog

Screen.Recording.2023-08-18.at.9.39.33.PM.mov

Environment

Happens on all env

Reproducer

https://stackblitz.com/edit/github-n1wv7s?file=src%2Fapp%2Fapp.component.ts

Angular version

16.2.1

PrimeNG version

16.2.0

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

16.20.1

Browser(s)

Chrome 115.0.5790.170

Steps to reproduce the behavior

  1. Insert Pick List Component in Dynamic Dialog
  2. If we try to drag items from source or target, the item goes behind dialog

Expected behavior

No response
@leoncydsilva leoncydsilva added the Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible label Aug 18, 2023
@leoncydsilva
Copy link
Contributor Author

leoncydsilva commented Aug 18, 2023 •
edited
Loading

PS: I tried setting autoZIndex: false and baseZIndex: 100000 but now table column header is on top of dialog, but drag is working fine . . Updated slackblitz with latest code and table

Screenshot 2023-08-18 at 10 07 39 PM

@SoyDiego SoyDiego mentioned this issue Aug 19, 2023
Merged
@SoyDiego
Copy link
Contributor

Hi @leoncydsilva , I have checked the problem and you are right.
I did a PR solving the problem. You can check it here: #13515
Now we should wait PrimeNG Team approve it if they think the solution is OK for them.

If you want a temporal solution until PrimeNG Team approve it, in your .css you can use:

.cdk-drag-preview {
    z-index: 2000 !important;
}

Thanks

@leoncydsilva
Copy link
Contributor Author

Hey @SoyDiego thanks a ton, will be using your workaround until the PR gets merged

@SoyDiego
Copy link
Contributor

Hey @SoyDiego thanks a ton, will be using your workaround until the PR gets merged

Happy to help, bro 🚀

@gucal gucal added Type: Bug Issue contains a bug related to a specific component. Something about the component is not working and removed Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible labels Aug 26, 2023
@gucal gucal added this to the 16.2.1 milestone Aug 26, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
LTS-PORTABLE Type: Bug Issue contains a bug related to a specific component. Something about the component is not working
Projects
None yet
Milestone
16.3.0
Development

Successfully merging a pull request may close this issue.

Picklist: Added dragConfig to assign zIndex SoyDiego/primeng
3 participants
@SoyDiego @gucal @leoncydsilva