user1613797 user1613797 - 1 year ago 122
jQuery Question

Detect if element position was changed in Jquery UI sortable

I use the following code to reorder items on my website:

$(document).ready(function () {
stop: function (event, ui) {
var id = $(ui.item).attr('id');

var url = '/en/account/changeposition?id=idreplace&position=posReplace';

url = url.replace("idreplace", id);
url = url.replace("posReplace", ui.item.index());

window.location.href = url;
distance: 15

However, even if I don't change element position and place element at the same place, Jquery UI will call 'stop'-function.

Is it possible to detect if element index (position) was changed without using custom data attributes?

// I would like to avoid adding custom data attributes like this:
<li id="id100" data-original-position="1"></li>
<li id="id101" data-original-position="2"></li>

Answer Source

Have a look at this answer.

It worked for me as follows:

    start: function(event, ui) {'start_pos', ui.item.index());
    stop: function(event, ui) {
        var start_pos ='start_pos');
        if (start_pos != ui.item.index()) {
            // the item got moved
        } else {
            // the item was returned to the same position
    update: function(event, ui) {
        $.post('/reorder', $(selector).sortable('serialize'))
            .done(function() {
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download