CODEWITHSUNDEEP
jqueryjquery-ui
Thomas Hunter II
Thomas Hunter II

Reputation: 5181

jQuery UI Draggable out of an Accordion

I need to be able to drag an element out of an accordion using jQuery UI. Unfortunately, the item being dragged is 'trapped' within the accordion.

The documentation says that using:

$( ".selector" ).draggable({ appendTo: 'body' });

Causes the element being dragged to be removed from it's current parent and added to the provided element, in this case the body. But, that does not work. It does work if used alongside the clone option:

$( ".selector" ).draggable({ appendTo: 'body', helper: 'clone' });

But, I don't want this element cloned as having two of them on the screen at once will confuse our users.

How can I drag an item out of an accordion and prevent it from being cloned?

Upvotes: 2

Views: 934

Answers (1)

Thomas Hunter II
Thomas Hunter II

Reputation: 5181

shaun5's answer worked for me, I ended up doing this to fix the problem. The behavior is slightly different than expected (e.g. I should probably be changing the CSS visibility property instead of display), but it works.

    $('.selector').draggable({
        appendTo: 'body',
        helper: 'clone',
        revert: 'true',
        start: function() {
            $(this).hide();
        },
        stop: function() {
            $(this).show();
        }
    });

Upvotes: 3

Related Questions