scriptculous drag and drop bug

[libsfan01]

hi im using drag and drop on my site, my problem is if i drop the
content on a part of the page other than a container, that content
disappears. is there someway to prevent this?

here is my code:

<script type='text/javascript'>

window.onload = function () {
var params = {
tag: 'div',
ghosting: true,
containment: new Array("container1","container2","container3"),
constraint: '',
dropOnEmpty: true
};

Sortable.create($("container1"), params);
Sortable.create($("container2"), params);
Sortable.create($("container3"), params);
};

</script>



<table width="100%">
<tr>
<td id="container1">
<div ID='content1' class="item">Content Item 1 <a href=''
onclick='Element.remove("content1"); return
false;alert("deleted");'>x</a></div>

<div ID='content3' class="item" onclick='Element.remove("content3");
return false;'>Content Item 3</div>
</td>
<td id="container2">
<div ID='content2' class="item" onclick='Element.remove("content2");
return false;'>Content Item 2</div>
</td>
<td id="container3"></td>
</tr>
</table>

 

[libsfan01]

the issue actually is that the 2nd and 3rd 'contents' disappear/get
deleted when u drag them onto an empty space however the 1st does not