Avatar of ROM
Flag for United Kingdom of Great Britain and Northern Ireland asked on

Best multi div drag and drop solution for web dev

Hi All,

Struggling a bit with JQuery sortable multisortable.

Been using sortable with single items dragging and dropping and quite happy that has been working great.

Now I have a new requirement to allow multi drag and drop. 

I have this working but I have the following issues:

a) Unless I make a separate event after all dragging and dropping is done the items remain selected as in the class remains the same. If I try to change this as part of the drag and drop it breaks and the additional divs just float with a style and did NOT attach to the new Div.

b) If I try to use a receive: event the same thing happens again. 

What suggestions do people have in a PHP/MySQL/JavaScript requirement to accommodate the multiple div drag and drop with database update events?

Currently single has been working great with Ajax updates in another project.

Scenario is a similar to a booking system.

People requirement appointments at a doctors practice  . so now I have 100-200 people that need appointments scheduling. I need to drag and drop them onto the correct Room and reorder them as single or multiple to ensure I can get people seen by the Doctor.

I need to drag and drop multiple. I need to move between rooms multiple. I need to reorder as multiple at times as well.

And of course need to update the database.

So..... happy to continue with JQuery multisortable but need to work out if these disjointed floating divs with styles suddenly or the norm or I can resolve.

Or please specify tried and tested solutions that people are using for this around the world.

Many thanks in advance



Avatar of undefined
Last Comment

8/22/2022 - Mon
Scott Fell

Is the main issue being able to select multiple items and dragging them to one spot? Or dragging one item at a time and have multiple items in the one spot?

Can you create an example page on your dev server with fake data that you can share or recreate a test case on https://codepen.io or other playground.  This should show what you have so far and the issue you have.

Hi Scott,

The issue is dragging multiple items.

I have excellent working projects with single item to multi item spots etc...

I have just been trying to use JQuery multisortable and find that I have a few odd issues.

a) the selected class does not disappear on a drop. And if I put a removeClass statement for the div it makes any more than 1 div float oddly with a style within the html and they do not actually exist linked within my target div.

b) If I try to use a RECEIVE: event trigger then the same odd behaviour happens above.

Both of these mean that if I drag 5 Divs.. Only the 1st Div ends up in the correct place.

That is my main issue.

If I can get multi div drag and drop working with Ajax db updates etc.. then that would be it done... I just thought I would ask if anyone is using anything else VERY successfully as I have been happy with JQuery sortable up to now.

Many thanks in advance

Scott Fell

I have never had a need to drag multiple items at once. But without looking at your example, it is hard to diagnose. 
Experts Exchange is like having an extremely knowledgeable team sitting and waiting for your call. Couldn't do my job half as well as I do without it!
James Murphy

Log in or sign up to see answer
Become an EE member today7-DAY FREE TRIAL
Members can start a 7-Day Free trial then enjoy unlimited access to the platform
Sign up - Free for 7 days
Learn why we charge membership fees
We get it - no one likes a content blocker. Take one extra minute and find out why we block content.
Not exactly the question you had in mind?
Sign up for an EE membership and get your own personalized solution. With an EE membership, you can ask unlimited troubleshooting, research, or opinion questions.
ask a question