get order of items jquery sortable and set order to them

Question

I use jquery draggble function for unorderd list (ul) and face a problem of getting the order of items after it changed and setting the order ofter page is loaded.Suppose we have the following code :

<html>
   <head>
     <script src="http://code.jquery.com/jquery-latest.js"></script>
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js>  </script>
     <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
   <script>
      $(document).ready(function(){

            $(".block").sortable({
            axis: 'y',
            update: function(event, ui) {// order changed
               var order = jQuery(this).sortable('toArray');
               // send this order to index.php and store it in db

            }
         });
      });
  </script>

  </head>
  <body>
      <ul class="block" type="none">
           <li id = "one">1</li>
           <li id = "two">2</li>
           <li id = "three">3</li>
           <li id = "four">4</li>
           <li id = "five">5</li>
      </ul>
  </body>

and the second file is

<html>
  <head>
  <script>
         $('.secondblock').sortable({axis:'y'});
      // get order from index.php and set it to .secondblock

  </script>
  </head>
    <body>
     <ul class="secondblock" type="none">
           <li id = "one">1</li>
           <li id = "two">2</li>
           <li id = "three">3</li>
           <li id = "four">4</li>
           <li id = "five">5</li>
      </ul>
    </body>
 </html>

Are there any possible solutions?

You just need a way to sort, right? http://stackoverflow.com/questions/929519/dynamically-arranging-divs-using-jquery/929607#929607 — Marcelo Assis, Aug 09 '12 at 03:56
This is almost an exact duplicate of your question from yesterday: http://stackoverflow.com/questions/11870024/set-order-to-jquery-sortable. Better to edit that one if there are slight changes you'd like to make. — Faust, Aug 09 '12 at 04:40
i'm sorry, but i thought that question wasn't clear, i've just added more complex explanation... — ilya.stmn, Aug 09 '12 at 05:22

Marcelo Assis · Accepted Answer · 2012-08-09T04:30:17.417

If you don't want to use that solution on the link I've commented, you can use this, much simpler:

function reorder(orderArray, elementContainer)
{
    $.each(orderArray, function(key, val){
        elementContainer.append($("#"+val));
    });
}

orderArray: an array containing all ids in the order you want ^{( exactly what sortable( "toArray") returns)}

elementContainer: is the jQuery object which contains your sortable items.

A working example here:
http://jsfiddle.net/ecP5k/1/

get order of items jquery sortable and set order to them

1 Answers1