Drag and Drop Sortable - drag-and-drop

Question

I just want to know where can I place some function in my drag and drop. I tried using alert messages to know where the event takes place but it's not executing any of my alert boxes. I put alert boxes in comment, those are places i used to place it but nothing happens. My drag and drop works but it cant fire alert box. I dont know what is wrong. Help me. Thanks.
var adjustment;
$(function () {
$("#container1, #container2").sortable({
group: 'ol.simple_with_animation',
pullPlaceholder: false,
onDragStart: function ($item, container, _super) {
var offset = $item.offset(),
pointer = container.rootGroup.pointer;
adjustment = {
left: pointer.left - offset.left,
top: pointer.top - offset.top
};
_super($item, container);
},
onDrag: function ($item, position) {
$item.css({
left: position.left - adjustment.left,
top: position.top - adjustment.top
});
// alert('oink');
},
onDrop: function ($item, container, _super) {
var $clonedItem = $('<li/>').css({ height: 0 });
$item.before($clonedItem);
$clonedItem.animate({ 'height': $item.height() });
// alert('wew');
$item.animate($clonedItem.position(), function () {
$clonedItem.detach();
_super($item, container);
// alert('oink');
});
// alert('oink');
},
});
//alert('oink');
});

Answer 1

This works perfect to me. Hope it will help those who struggle too :)
$("#container1, #container2").sortable(
{
group: 'ol.simple_with_animation',
onDrop: function ($item, container, _super) {
var $clonedItem = $('<li/>').css({ height: 0 });
$item.before($clonedItem);
$clonedItem.animate({ 'height': $item.height() });
$item.animate($clonedItem.position(), function () {
$clonedItem.detach();
_super($item, container);
});
alert('oink');
}
});