Question

I use jQuery Sortable plugin for sorting a list of pages. Users can rearrange the pages in custom order. However, I want the placeholder box to contain the page number the page will get on release.

If the user has three pages in their list, and rearranges the second page, to the end, the placeholder for page three would show the number three.

How would I go about to do this?

Answer 1

Try this :

$("#sortable").sortable({
      placeholder: 'ui-state-highlight ui-sort-position',
      helper: 'clone',
      sort: function(e,ui) {
         $(ui.placeholder).html(Number($("#sortable > li:visible").index(ui.placeholder)+1));
      }
});​

will show you the new index (+1) … working demo here