UI Sortables

UI Sortables

Sorry if I am both "stupid" and partly rude but why is it that I cannot find a simple explanation or documentation for non JQuery type people (me) about how to properly use Sortables.?

I have a situation where I need to use sortables like this:

<div class="column" id="col1">

<div class="portlet">
<div class="portlet-header"><div class="toggleup"></div>Feeds</div>
<div class="portlet-content">Lorem ipsum dolor sit amet, consectetuer adipiscing elit</div>
</div>
<div class="portlet">
<div class="portlet-header"><div class="toggleup"></div>News</div>
<div class="portlet-content">Lorem ipsum dolor sit amet, consectetuer adipiscing elit</div>
</div>

</div>

<div class="column" id="col2">

<div class="portlet">
<div class="portlet-header"><div class="toggleup"></div>Shopping</div>
<div class="portlet-content">Lorem ipsum dolor sit amet, consectetuer adipiscing elit</div>
</div>

</div>

but there will be 4 columns.

This JQuery gets the things "moving"

$(function() {

  $(".column").sortable({
   revert: true,
   scroll: true,
   appendTo: 'body',
   connectWith: '.column',
   cancel: '.disabled',
   stop: function() {

is this where the serialize goes?









if not where?
What is the code to serialize the columns into 1 array?
   
   },
   revertDuration:50000,
         scope:'scope',
         opacity: 0.80,
  });


 $(".portlet").addClass("ui-widget ui-widget-content ui-helper-clearfix ui-corner-all")
     .find(".portlet-header")
    .addClass("ui-widget-header ui-corner-all")
    .prepend('<span class="ui-icon ui-icon-minusthick"></span>')
    .end()
   .find(".portlet-content");

  $(".portlet-header .toggleup").click(function() {
   $(this).toggleClass("ui-icon-minusthick").toggleClass("ui-icon-plusthick");
   $(this).parents(".portlet:first").find(".portlet-content").toggle();
  });

  $(".column").disableSelection();
 });
 });





















BUT where do I and how do I (in simple english) put the .sortable(serialize)?

Then where do I put any code (and again what is it) to read that serialization having saved it to say a cookie (cookie plugin installed)  for the next time the page is opened?

I know this is an "old" chestnut, but for non js types like me all documentation is martian.  It may be a really good idea to have an example as most of "us" can follow the example, but cannot read/understand  "the snipt codes" often given in answers.