[jQuery] jQ UI: sortable and draggable...

[jQuery] jQ UI: sortable and draggable...

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
</head>
<body bgcolor="#ffffff" text="#000000">
<font face="Arial">Hi,
I'm struggling to mix the effects of sortable and draggable...
I have two divs, each containing items that I want to be both draggable
and sortable.
Pseudo code:
<div class="list" id="list1">
</font><font face="Arial">   <div class="item">foo</div>
</font><font face="Arial">   <div class="item">bar</div>
</font><font face="Arial">   <div class="item">moo</div>
</div>
</font><font face="Arial"><div class="list" id="list2">
</font><font face="Arial">   <div class="item">chimp</div>
</font><font face="Arial">   <div class="item">fish</div>
</font><font face="Arial">   <div
class="item">marmoset</div>
</div>
I want to configure it so that if I drag an item within it's containing
list, it'll just do normal sortable stuff - this is easy to do:
$('list').sortable({items:'.item'});
But I also want to be able to drag stuff from one list to the other -
eg. drag "foo" from #list1 in to #list2
And when I drag "foo" to #list2 I want to have the sortable effect work
so that if I drag it between "chimp" and "fish", then "fish" and
"marmoset" will move down to make room for "foo".
I'm completely stumped as to how to achieve this - any ideas?
Guy
</font>
</body>
</html>