I've been working on this for the past 2 days and I cannot get sortable to return the list order, I'm probably doing some really silly, can someone help me please.
Here is the code.
The alert box appears (twice) but always contains blank. Any ideas?
- <style type="text/css">
#available, #selected { list-style-type: none; margin: 0; padding: 0; float: left; margin-right: 10px; background: #eee; padding: 5px; width: 143px;}
#sortable1 li, #sortable2 li, #sortable3 li { margin: 5px; padding: 5px; font-size: 1.2em; width: 120px; }
</style>
<script type="text/javascript">
var order = 0;
$(function() {
$("#available, #selected").sortable({
connectWith: '.connectedSortable',
dropOnEmpty: true,
update: function (event,ui) {
var order = $("#selected").sortable('serialize',{key:'string'});
alert(order);
}
}).disableSelection();
});
</script>
<div class="stacks">
<ul id="available" class="connectedSortable">
<li class="ui-state-default">Item 1</li>
<li class="ui-state-default">Item 2</li>
<li class="ui-state-default">Item 3</li>
<li class="ui-state-default">Item 4</li>
<li class="ui-state-default">Item 5</li>
</ul>
<ul id="selected" class="connectedSortable">
<li class="ui-state-default">Item 1</li>
</ul>
</div>
Thanks in advance.