So I've created two custom classes with "containers" (droppables) and "items" (draggables) which have custom properties behaviors and some awareness of eachother. Now I got to the point of having a container tally up the price of all items inside it, but the problem is that this only works on items that haven't been moved from one container to another. Since I move them with clone(), they lose the properties I've added.
Is there a simple way to ensure that properties I've added are copied when cloning? I would prefer to avoid workarounds, and stay close to good OOP principles.... My cloning code looks like this. Already it's a bit ugly because it re- addes behaviors to the draggable (getting this to work in the first place was a bit confusing. If you just happen to see a fix for this mess that would be great too) //Now actually drop it. Clone it or don't.... if (dropped.parentNode.dragCopy) { $(dropped).clone().appendTo(this).removeClass("ui- draggable").draggable({ //Make sure we re-apply this snippet that changes opacity of dragged items. Gets lost // during cloning helper: 'clone', start: function (ev, ui) { $(this).css({opacity: .5}); }, stop: function (ev, ui) { $(this).css({opacity: 1}); } });