get the start position of an item using the jquery ui sortable plugin

Question

I am using the jQuery UI sortable plugin and I am trying to get 2 alerts

I want the staring position of the element and the finished position of the element.

$(function() {
    $("#filterlist ul").sortable({ opacity: 0.6, cursor: 'move', update: function(event, ui) {
            alert(ui.item.prevAll().length + 1);
        }
    });
});

I can get the position of the item after it has been dragged by using:-

ui.item.prevAll().length + 1

What do I use to get the position it started from?

Duplicate of: http://stackoverflow.com/questions/2442232/getting-the-position-of-the-element-in-a-list-when-its-drag-dropped-ui-sortable — Mottie, Apr 12 '10 at 13:28

Reigel · Answer 1 · 2010-04-12T08:41:56.500

11

$(function() {

    $("#sortable").sortable({
       start: function(event, ui) { console.log('before @ '+ ui.item.index()) },
       update: function(event, ui) { console.log('now @ '+ ui.item.index()) }
    });

});

try this demo and watch at the console...

edited Apr 12 '10 at 08:41

answered Apr 12 '10 at 08:30

Reigel

62,834
21
119
135

score 10 · Accepted Answer · answered Apr 12 '10 at 08:22

Use the start event and "cache" the starting position

var start;
$(function() {
    $("#filterlist ul").sortable({
        opacity: 0.6,
        cursor: 'move',
        start: function(event, ui) {
            start = ui.item.prevAll().length + 1;
        },
        update: function(event, ui) {
            alert(start + " -> " + (ui.item.prevAll().length + 1));
        }
    });
})

get the start position of an item using the jquery ui sortable plugin

2 Answers2

Linked