SortableJS / Sortable

Reorderable drag-and-drop lists for modern browsers and touch devices. No jQuery or framework required.
https://sortablejs.github.io/Sortable/
MIT License
29.6k stars 3.7k forks source link

[bug] Dynamically added elements which meet filter criteria are counted in oldIndex and newIndex #1858

Open tgljamesuk opened 4 years ago

tgljamesuk commented 4 years ago

When dynamically adding an element which matches the filter option to a sortable list within one of the event handlers, the added element seems to be counted in the event handlers oldIndex and newIndex properties.

Hopefully this JSBin example will help illustrate the issue (I'm using jQuery and the Sortable jQuery shim here, but I assume the same would occur with vanilla JS?)

In the example, if you drag Item 1 to the last position, the placeholder (which doesn't exist to start with, but has a class of filtered, so should be ignored by sortable?) is added in the correct location and the console shows the correct oldIndex for the moved element onStart. onEnd's oldIndex is also correct to start with, though the newIndex is reported as 3 which is incorrect - there are only 3 non-filtered elements, so this should be 2.

If you then drag the new top item (Item 2) to the bottom, the indexes reported in the console are all off by one and the placeholder i'm adding appears in the wrong place - onStart's oldIndex is 1 (should be 0), as is onEnd's oldIndex and onEnd's newIndex is 3 (should be 2).

Hope this makes sense - let me know if you need any more info.

waynevanson commented 4 years ago

@tgljamesuk I need to reread this, but check out oldDraggableIndex at https://github.com/SortableJS/Sortable#event-object-demo.

Replace oldIndex with oldDraggableIndex and see if that makes a difference.