strange error with droppables
I'm currently trying to implement a drag/droppable selection system, but I'm getting a bug that I can't seem to crush. I have 2 ul lists sitting above and below each other, the first (.snapTo1) with empty li's, the second (draggable1) with the content to be dropped into snapTo to make a full product.
When I drag a draggable li onto the corresponding place in snapTo, it acts as if it is going to snap, and when I drop it, a class is added to snapTo, but the draggable disappears.
I can fix it, however, to do this, I've had to break the JS (after adding class, I add the nonsense code .break(forsnap); and this makes the draggable stay in place. This however, isn't the proper way of doing things, and if I need to add any additional events later down the line I imagine this will be quite susceptible to breakage.
My code is below, if anyone has had a similar issue, or can point me in the right direction that would be great.
Thanks, Dan
- $("#draggable1 li").draggable({
helper: 'clone',
snap: '.snapTo1',
snapMode: 'inner'
});
$(".snapTo1").droppable({
accept: '#draggable1 li',
drop: function(event, ui) {
$(this).addClass('').break(forsnap);
}
});