Sortable and Cookie/history, need some help

Sortable and Cookie/history, need some help


Hello,
I'm trying to make a frontpage like iGoogle, it works very nicely with
sortable but I cant get to keep the changes users made. each loading
the changes disapear
I tried two options:
* Cookie with the plugin from www.stilbuero.de/2006/09/17/cookie-plugin-for-jquery/
* Serialize which gives me a nice hash but don't really know what to
do with it
I'm using Jquerry 1.2.3 and Jquery.UI 1.5b
I have another problem with the "additems" function, I would like to
increment the '+i+' and refresh the newly made module to be able to
sort it
Any help/direction would be greatly appreciated
<code>
<script type="text/javascript">
jQuery.noConflict();
function addItems(e) {
    for (var i = e - 1; i >= 0; i--){
        jQuery('.Col').append('<div class="Mod" id=""'+i+'"">Additional
Content</div>');
    };
}
jQuery(window).bind("load",function(){
    jQuery("#content").sortable({
        items: ".Mod",
        revert: true,
        scroll: false,
        opacity: 20,
        containment: 'parent',
        placeholder: 'SortHelper', //the class te placeholder should have
        placeholderElement: '> div', //Due to IE's shitty rendering,....
        sort: function(e, ui)
            {
            serialize(".Col");
            },
        update: function()
            {
            jQuery.cookie('test', 'serialize', { expires: 7 });
            },
        });
});
function serialize(s)
{
var str = [ ];
var key = 'myKey[ ]=';
var delimiter = '&'
jQuery(s + "> *").not('.ui-sortable-helper').each(function() {
str.push(key+this.getAttribute('id'));
});
};
</script>
</head>
..........
<div id="content">
<div class="Col ">
    <div class="Mod" id="1">
        ----- My content ---------
    </div>
    <div class="Mod" id="2">
        ----- My content ---------
    </div>
    <div class="Mod" id="3">
        ----- My content ---------
    </div>
</div>
<div class="Col ">
    <div class="Mod" id="4">
        ----- My content ---------
    </div>
    <div class="Mod" id="5">
        ----- My content ---------
    </div>
    <div class="Mod" id="6">
        ----- My content ---------
    </div>
</div>
</div>