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.

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

Gridstack modal clone issue #2352

Closed
DigitagDev opened this issue May 31, 2023 · 4 comments · Fixed by #2353
Closed

Gridstack modal clone issue #2352

DigitagDev opened this issue May 31, 2023 · 4 comments · Fixed by #2353

Comments

@DigitagDev
Copy link
Contributor

Hello, I am working on a project where I need to drag items from a palette to the grid. This project is inside a Bootstrap modal, and from what I've noticed, when we use the 'clone' helper or even customize it, the cloned item being transferred to the grid does not appear. This is different from what we see when we perform the same process outside of a modal. Unfortunately, I have not been able to find an answer to this problem in the documentation, let alone a workaround for it. Here is a code example on JSFiddle. it seens to be a z-index issue

https://jsfiddle.net/bodinho97/Lakroyus/27/
Sem título

@DigitagDev
Copy link
Contributor Author

DigitagDev commented May 31, 2023

WorkAround , take me sometime to discover that bootstrap modal has a z-index of 1050; even placing a z-index of 999 on gridstack content wont work.

@adumesny
Copy link
Member

adumesny commented May 31, 2023

we have this in CSS, which is not enough

.grid-stack-item {
  &.ui-draggable-dragging,
  &.ui-resizable-resizing {
    z-index: 100;

1050 is a really odd number.

@adumesny
Copy link
Member

but actually it should be that (less specific to affect drag in area, and higher. will fix.

.ui-draggable-dragging,
.ui-resizable-resizing {
  z-index: 10000;
}

@adumesny adumesny reopened this May 31, 2023
adumesny added a commit to adumesny/gridstack.js that referenced this issue May 31, 2023
fix gridstack#2352
* make sure .ui-draggable-dragging is not just item (dragIn region) and high enough z-index to solve bootstrap modals too
@adumesny
Copy link
Member

fixed in next release. don't forget to donate if you find this lib useful!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants