Updating sort order during sort change event - jQuery UI

Question

I want the value of the list element to be the index of the sorted position during sort event. This value should update automatically during sort change event. ``` ``` I created a fiddle http://jsfiddle.net/jagan2explore/4mcpq/ to explain my requirement. If i move 1'st element to 5th position all other elements values are updated rightly, If i move 5th to 1'st the value updates accordingly. Suppose…

Accepted Answer

Try this:

```
update : function(event, ui) {
    var index = ui.item.index();
    var start_pos = ui.item.data('start_pos');

//update the html of the moved item to the current index
    $('#sortable li:nth-child(' + (index + 1) + ')').html(index);

if (start_pos < index) {
        //update the items before the re-ordered item
        for(var i=index; i > 0; i--){
            $('#sortable li:nth-child(' + i + ')').html(i - 1);
        }
    }else {
        //update the items after the re-ordered item
        for(var i=index+2;i <= $("#sortable li").length; i++){
            $('#sortable li:nth-child(' + i + ')').html(i-1);
        }
    }
},
```

Demo: jsfiddle

Updating sort order during sort change event - jQuery UI

Solution

Problem