Sortable: Get newIndex during `onMove`

[schwamic]

In the current version there is no easy way to get the current order of the list during onMove. Neither the 'ghost'-element nor an exact position of the 'drag'-element can be identified. However, there must be an exact order within Sortable, why is this information not accessible? It would be a nice feature for a better UX, if the index of the list-items would be updated during onMove instead of onEnd.

I have already tested the following:

• Sortable.utils.index(evt.related, '.draggable')
• onMove: evt.dragged or evt.related
• sortable.toArray()

The index returned is not consistent and therefore cannot be used easily. Often the index by one or two positions does not match the current list. Also the 'toArray' does not give any clear information about the current order of the elements while onMove, and is difficult to find out how the indexes have to be mapped.

Is there currently still another way to get the current order during onMove?

[bhavin36]

@schwamic If I understand you problem correctly you want to show the current index _onMove_. Check out this.
You can use CSS counters to show the current index...
Hope this helps.

[antoine-nedelec]

Yep, I do have the same thing going on here. I use SortableJs to sort a list of canvas elements (1 element is up to the front, 2nd behind, etc...).

When I drag element on my list i'd like to have the instant update/change on my canvas but I currently have to wait until "onUpdate", "onSort", or "onEnd" to trigger. There is still no way to fetch the current order with the "onMove" event ?

[owen-m1]

@antoine-nedelec Hang tight and it will be in the next version. If you really need it now, you can use Sortable.utils.index(element, '>*');

[antoine-nedelec]

Thanks that would be great :), but I couldn't find a way to use:
Sortable.utils.index(element, '>*');
In my code.

Would you have a working example with this ?

[owen-m1]

@antoine-nedelec Use it in the onMove function to get the index in real time

[owen-m1]

@antoine-nedelec 1.8.0 is published.
As of 1.8.0, use the onChange event.

[antoine-nedelec]

Awesome it works perfectly, thanks. If anyone needs it, the sorted list is under "evt.target.childNodes"