Leaving gaps in a sortable list
Hey,
I am stuck in an epic conundrum. So I am trying to make a board with sticky notes. The notes can go from one column to another and can also be sorted with columns.
This is all easily achievable by jQuery Sortable. I can connect as many lists I want and sort them to my hearts content.
But there's an inbuilt behavior I want to override. When I remove an item from a list, the list automatically sorts itself and I want to stop it from doing that.
Here's the JSFiddle
As you can see, I have three columns, if I move Card 3 to the first column, I, for now, am making a dummy card in its place in order to keep that space occupied, but this solution is rather inelegant and would like some more suggestions on how to tackle this.
Please keep in mind that I would also like this space to occupied again by another card, be it from the same list or from another.
I have also considered making this a droppable area but that doesn't seem to work.
Any suggestions?