Question

I’ve got a drag and drop UI basically working with jquery ui and backbone.js. My view looks like:

render: function()
{
    $(this.el).html(ich.template_bucket(this.model.toJSON()));

    $(this.el).draggable(
        {
            helper: "clone"
        }
    );

    var that = this;
    $(this.el).droppable(
        {
            hoverClass: 'ui-state-hover',
            drop: function( event, ui )
            {
                var from_bucket_id = ui.draggable.attr('id');
                var to_bucket_id = $(that.el).attr('id');
            }
        }
    );

    return this;
},

I can access the dropped on view via that, but is it possible to get a hold of the dragged view inside the droppable callback?

Alternatively, what I’m ultimately trying to do is update the two views (the dragged and dropped into views) when something happens inside a modal window that pops up (another backbone view) after the drag happens. This view doesn’t share models with the two views, so I’m not sure if there’s any events I can listen to.

Answer 1

In the dropped-on view I usually get the dragged view’s model and update it. I do that by adding a cid attribute to each dragged view’s el Dom element, so its easy to get in the drop function. My models are stored in a collection the dropped-on view has access to.