This is really awesome yet so simple.
Up to this day, I've been creating specific controllers for each resource.
Using SGID is brilliant.

Thanks for the tip!

This is very cool. I have it working up until dropping the item from the drag. Then I am getting the error:

Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'dataset'). I am using rails 7 and esbuild though so I'm not sure if that is causing it. Any thoughts on why it is doing that?

I'm confused once sgid showed up. Is that a feature of hotwire ?

Also, I immediately thought of a part 2 for you (haha!): how to move items between multiple lists (example: a Trello board). I'm guessing that is "only" the addition of some sort of target list id ?

It’s part of Global Id in Rails. In the view, a signed global id is inserted as a data attribute and the record is located on the backend once’s passed through from the stimulus controller.

Can you make some suggestions for how to expand this to 2 lists? would the Stimulus controller would have to get re-written for each of the two lists on the page? And then get re-written again if the same list (but not the second one) is used on yet another page.  Seems to make the number of file names multiply exponentially !

Hi! Coming to this a little late! I have the drag and drop working on screen, but I'm not able to successfully achieve the PUT on a path so the drag/drop actions becomes permanent (ie, gets to my controller which will record all the relevant position values).

I keep getting this error:
Started PUT "/industries" for ::1 at 2022-08-02 17:43:22 -0700
ActionController::RoutingError (No route matches [PUT] "/industries"):

But I  certainly have an /industries route. I've also tried to connect to ANY route I have but nothing works. Any idea what's going on? 

Here's the relevant code, I've double-checked it and don't think anything is wrong with it. Thanks!

  async updatePosition(event) {

    const response = await put('/industries', {

      body: JSON.stringify({

        sgid: event.item.dataset.sgid,

        position: event.newIndex + 1

      })

    })

    if (response.ok) {

      console.log(event.item.dataset.sgid)

    }

  }