Topic: drag and drop plugin + accordion
I have two panels, the left panel is an accordion. Within each accordion-body i have a list of sortable-item divs. The right panel is just a simple div with a list of sortable-item divs. I have the drag and drop plugin and it all seems to initalize ok - no errors... and now I am trying to drag stuff from the left panel into the right panel... except it's not working. There are no errors thrown. Only once somehow by magic was I able to drag something from the left panel into the right panel. It seems to be really flaky.
What's more, while experimenting and trying to find out why it's not really working, I accidentally uncovered a nasty bug with the mdb drag and drop. Just drag any of those sortable items and then while dragging (don't let go of the left mouse button) click on the right mouse button to bring up the browser context menu. Once in a while, the item I was dragging is now stuck in lala-land and you can never get to it again.
Here is a link to my test page -
Update - I noticed that if I drag really fast from left to right, it'll bring the item over from the left panel to the right panel. Seems to me maybe that means perhaps some animation is interfering with the drag and drop.
I built a quick demo in which I tried to recreate this problem: https://distec6d.mdbgo.io/ unfortunately I am not able to reproduce this problem in it. maybe I missed something? Was it about such a solution?
- Go to the MDB5 drag and drop page.
- Click on "coping items" - yes you have a typo on the page.
- Click on "Open in MDB editor" for the "coping items" HTML snippet
- It doesn't work well at all. Dragging stuff over from the top to the bottom panel is glitchy. Sorting items in the bottom panel is glitchy.
I am using latest Chrome on Windows 10 if that makes any difference.
This glitchiness is the same problem I am experiencing - so it's not really related to the use of an accordion at all - it's just glitchy out of the box.
I created a snippet here -
Unfortunately it behaves differently because of the problem that you mentioned only occurs in your snippets. Instead - here is a video recording showing the issue. You'll notice that as soon as I drag over the item to the other side, it appears as the last item in the list. Then when I continue dragging it up into the list itself, it chews up the last 2 items in the list. When I drop it, it all goes back to normal. I repeat this demonstration several times in the video.
Here it is -
Ok, now the website works for me. I can also see what's going on. Before that, I did not pay attention to it. I can see that this error also appears on our website, but not always. We'll check what's going on and fix it.
- User: Pro
- Premium support: No
- Technology: MDB 5
- MDB Version: 3.2.0
- Device: All
- Browser: All
- OS: All
- Provided sample code: No
- Provided link: Yes