title: Updating sort order during sort change event - jQuery UI
body: <p>I want the value of the list element to be the index of the sorted position during sort event.</p>
  
  <p>This value should update automatically during sort change event. </p>
  
  <pre><code>        &lt;script type="text/javascript"&gt;
          $(function() {
              $('#sortable').sortable({
                  start : function(event, ui) {
                      var start_pos = ui.item.index();
                      ui.item.data('start_pos', start_pos);
                  },
                  change : function(event, ui) {
                      var start_pos = ui.item.data('start_pos');
                      var index = ui.placeholder.index();
  
                      if (start_pos &lt; index) {
                          $('#sortable li:nth-child(' + index + ')').html(index-2);
                      } else {
                          $('#sortable li:eq(' + (index + 1) + ')').html(index + 1);
                      }
                  },
                  update : function(event, ui) {
                      var index = ui.item.index();
                      $('#sortable li:nth-child(' + (index + 1) + ')').html(index);
  
                  },
                  axis : 'y'
              });
          });
  
  
      &lt;/script&gt;
  </code></pre>
  
  <p>I created a fiddle
  <a href="http://jsfiddle.net/jagan2explore/4mcpq/" rel="nofollow">http://jsfiddle.net/jagan2explore/4mcpq/</a></p>
  
  <p>to explain my requirement.</p>
  
  <p>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.</p>
  
  <p>Suppose if i move a list element from 1 to 5 &amp; from 5 to 2 without leaving (during single sort event ), the values are not updated accordingly. </p>
  
  <p>Am i missing something??</p>
  
  <p>Any help would be greatly appreciated. Thanks in advance</p>