Our great sponsors
-
sortablejs
Reorderable drag-and-drop lists for modern browsers and touch devices. No jQuery or framework required.
-
SurveyJS
Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.
I went to look for SortableJS, clicked on the demo, scrolled to the grid example which was doing exactly the simple stuff I was looking for.
React Beautiful Dnd: build by Atlassian for Trello, it's reliable BUT
React Grid Layout: quite easy to setup, and quite powerful also. But I wanted to be able to move items in a grid so that it takes the position of another item in the grid and the grid keeps the same shape at the end of the drag/drop action - the defauilt behavior of this lib being to "make space" for the dragged item and break the grid layout. After spending one hour on it, I still couldn't find the way to achieve my goal, I quit.
-react-draggable: I must say I didn't see that one, and didn't try.
-react-grid-dnd: it looked like an easy setup and exactly want I was looking for, but... it's not maintained, and not working with npm7+ because it has react 16 as a dependency. So I had all the code setup before installing the lib, and I was quite fed up and tired when I discovered I would need to change my npm version to use it, or do some tricks here and there...
Then I thought : damn, there should be out there a JavaScript library doing the simple thing I've asked for ! And I saw in this last react-sortablejs that it was a "React bindings to SortableJS".