jquery draggable & droppable get source container (that draggable came from)

Question

I made this jsfiddle for a different answer and I\'m wondering how I can get the souce container that the droppable came from

http://jsfiddle.net/d7wsz/8/

Th

Answer 1

You can use a variable which you set in the start event of the draggable and get that info in the stop event of the droppable.

$(function () {
    var sourceElement;
    $("#Table1 tr:not(.disabled), #Table2 tr:not(.disabled), #Table3 tr:not(.disabled)").draggable({
        helper: 'clone',
        revert: 'invalid',
        start: function (event, ui) {
            $(this).css('opacity', '.5');
            //NEW
            sourceElement = $(this).closest('table').attr('id');
        },
        stop: function (event, ui) {
            $(this).css('opacity', '1');
        }
    });

    $("#Table1, #Table2, #Table3").droppable({
        drop: function (event, ui) {
            $(ui.draggable).appendTo(this);
            //alert sourceElement
            alert($(ui.draggable).text() +
                ' was draged from ' + sourceElement + ' to ' + $(this).attr('id') + '.');

        }
    });

});

See my updated jsfiddle If you have more than those tables on your page you might think about giving them a class to properly identify them.