如何将图像拖放到容器中,然后根据丢弃的内容更新容器?

bob*_*obb 5 ajax jquery jquery-ui droppable draggable

我希望能够将图像拖动到两个容器(容器1和容器2)中的一个容器中.从那里,根据图像被丢弃到哪个容器,我想用数据库调用更新该容器(或者只更新我的一个表中的行).

我想使用http://jqueryui.com/demos/droppable/来实现这一点,但我不知道如何处理请求,以及如何让每个容器监听事件处理程序(删除图片).

我在下面画了一个非常糟糕的图解释我的意思:

可跌落系统图

Mat*_*all 5

投掷的演示说明究竟是如何做到这样的事情.

$(function() {
    $( "#draggable" ).draggable();
    $( "#droppable" ).droppable({
        drop: function( event, ui ) {
            $( this )
                .addClass( "ui-state-highlight" )
                .find( "p" )
                    .html( "Dropped!" );
        }
    });
});
Run Code Online (Sandbox Code Playgroud)

我自己真正基本的演示→(更新)