Drag & Drop Cart Problem

an ajax drag and drop cart, but witrh a few problems.

[Kings on steeds]

I'm trying to make a drag & drop cart I could plug into our magento shop, i've got what i think is a nice code and it works but only for the first product in my list. the second product wont drag past its parents bounds, which sucks! can only tell what i've done wrong please?

uses prototype & script.aculo.us.

var dropcart = {
 // custom options
 autoload: 1,
 list: 'products',
 cart: 'mycart',
 cartsummery: 'mycartsummery',
 dropclass: 'product-item',
 carthover: 'hover',
 cartupdatestring: 'update.php?idx=#[id]&qty=#[qty]',
 cartrequeststring: 'cart.php',
 // end custom options 
 pro: function(){ return Prototype ? 1 : 0 },
 script: function(){ return Event ? 1 : 0},
 load: function() {
 if(dropcart.pro() && dropcart.script()){
  dropcart.makedrags();
  dropcart.makedrop();
 } else { throw "Sorry, required libs not found"; }
 },
 makedrags: function(){ 
 $(dropcart.list).descendants().each(function(s){
  dropcart.makedragable(s.id);
 });
 },
 makedragable: function(ele){
 new Draggable(ele, { revert: true});
 },
 makedrop: function(){
 Droppables.add(dropcart.cart, { 
  accept: dropcart.dropclass,
  hoverclass: dropcart.carthover,
  onDrop: function(element) { dropcart.updatecart(element); }
 });
 },
 updatecart: function(idx){
  var id = $(idx).readAttribute('prodid');
  var qty = $(idx).readAttribute('qty') ? $(id).readAttribute('qty') : 1;
  var url = dropcart.cartupdatestring.gsub('#[id]',id);
  url = url.gsub('#[qty]',qty);
  new Ajax.Request(url, {
  method: 'get',
  onSuccess: function(transport) {
   new Ajax.Updater(dropcart.cartsummery, dropcart.cartrequeststring, {});
  }
 });
 }
}
if(dropcart.autoload){ Event.observe(window, 'load', function() { dropcart.load(); }); }

and my html looks like this

 <div id='cart-container'>
 <div id='mycart'>
 </div>
 <span id='mycartsummery'>0 Items - Cart Total: 0.00</span>
 </div>
 <br /><br />
 <h3>Products</h3>
 <div id='products'>
 <span id='1' class='product-item' prodid='12'>Product one - £12.99</span>
 <span id='2' class='product-item' prodid='11'>Product two - £18.95</span>
 </div>

[whoisgregg]

Are there any browser errors on the attempt to drag the second product? If you aren't already, I'd recommend debugging this in Firefox with the Firebug plug-in installed.

[Kings on steeds]

hi gregg, nope no errors....i have been playing with in firebug, i just can't get the second product to pass its parents bounds...cant understand it, can't think its a lib error in script.aclo.us would have been picked up by now, but just don't work. any ideas?