Thanks for your comments. I've just cracked it (I think). I was getting
the drop event ok but couldn't work out how to move the dragged div. It
was just sitting where I'd dropped it.
The secret is to use a cloned helper with $('.drag').draggable({helper:
'clone'}); and then move the original draggable div using:
$(".drop").droppable({
accept: ".drag",
tolerance: 'pointer',
activeClass: 'droppable-active',
hoverClass: 'droppable-hover',
drop: function(ev, ui) {
if (this.children.length == 0) {
$(this).append(ui.draggable.element);
}
}
});
I think my problem was that without a helper the draggable div is
converted to position: absolute so that it didn't matter which table
cell it was in.
I just wish I knew more about the DOM.
