Bueno, hay que mirar un poco el código y ver cómo funciona.
Aquí le pongo 2 alerts que luego podrás reemplazar por lo que necesites:
Código PHP:
<script type="text/javascript">
$(document).ready(function(){
$("#cart").Droppable(
{
accept : 'products',
activeclass: 'cart-active',
hoverclass: 'cart-hover',
ondrop: function (zone, drag)
{
if ($("#"+ drag.id + "_cart").size() == 0){
alert('se ha agregado:'+drag.id);
$("#items").append('<div id="' + drag.id + '_cartTitle"></div><div id="' + drag.id + '_cart"></div>');
}
$("#"+ drag.id + "_cart").append('<img src="' + drag.src +'" class="cart-items" alt="' + drag.id + '" />');
$("#"+ drag.id + "_cartTitle").html(drag.alt + " (" + $("img",document.getElementById(drag.id + "_cart")).size() + ")");
$(".cart-items").Draggable(
{
zIndex: 1000,
ghosting: true,
revert: true,
opacity: 0.7,
fx: 200
}
);
},
tolerance: 'pointer'
}
);
$("#wastebin").Droppable(
{
accept : 'cart-items',
activeclass: 'wastebin-active',
hoverclass: 'wastebin-hover',
ondrop: function (zone, drag)
{
alert('se ha removido:'+drag.alt);
$(drag).remove();
if ($("img",document.getElementById(drag.alt + "_cart")).size() == 0){
$("#"+ drag.alt + "_cartTitle,#" + drag.alt + "_cart").remove();
}else{
$("#"+ drag.alt + "_cartTitle").html($("#" + drag.alt).get(0).alt + " (" + $("img",document.getElementById(drag.alt + "_cart")).size() + ")");
;
}
},
tolerance: 'pointer'
}
);
$(".products").Draggable(
{
zIndex: 1000,
ghosting: true,
revert: true,
opacity: 0.7,
fx: 200
}
);
});
</script>