4

I just googled a lot but couldn't find an answer.

I have a resizable div and want to drop something onto it. It works very well so far. But when I use the clone-helper, the item just disappears when dropped. What am I doing wrong?

$('#resizable').droppable({

  });

$('.base').draggable({
    helper: 'clone',
    stack: '#resizable',
    containment: '#resizable',
    cursor: 'move',
    appendTo: '#resizable' 
  });

I played with appendTo, accept and everything. I just can't get it to work... Any idea is appreciated very much!

  • Maybe provide some of the html to? So we can see what your trying to drag/resize into which element a little better :) Maybe it doesn't dissapear, but just gets stuck in a div behind it. – Tessmore Nov 15 '11 at 16:04

2 Answers2

10

I would try adding the following to your droppable's options:

$('#resizable').droppable({
    drop: function(event, ui) {
        $.ui.ddmanager.current.cancelHelperRemoval = true;
    }
});
Sisi
  • 1,516
  • 2
  • 9
  • 11
1

We were discussing similar issue in topic revert 'invalid' with grid doesn't return to start position with jQuery UI Draggable and @GregL offered workaround for this: http://jsfiddle.net/greglockwood/EBHWr/

I think this is exactly your situation. You need to define drop handler in droppable. This looks like a bug in jQuery with draggable and helper: "clone".

Community
  • 1
  • 1
yko
  • 2,710
  • 13
  • 15
  • If I change the droppable code of my resizable div, the draggable isn't draggable anymore... I will post to jsFiddle to make my problem clear :) thx so far! – Florian Kratschmann Nov 15 '11 at 16:39
  • So, thank you again - I just created the [jsFiddle](http://jsfiddle.net/Florian_Kratschmann/eTqZ2/1/) just uncomment the helper-line and you see my problem ... – Florian Kratschmann Nov 17 '11 at 10:31