Jquery UI 可排序 - 可拖动 - 丢失可排序

Question

我有一个 jquery ui 可排序列表。我设置了一个“垃圾桶”来扔掉列表中不想要的项目。一旦我在列表项上设置了“可拖动”，它们就不再排序。

垃圾桶 使

$("#trash").droppable({
      drop: function(ev, li)
      {
        var $element = li.draggable;
        $element.remove();
    $.ajax({                                      
        url: 'deltask.php',                          
        data: 'id='+$element.attr('id'),            
        dataType: 'html',                   
        success: function(data)          
        {
        }
    });

      }
});

列表可排序

    // set our listdiv ul as sortable 
    $("#listdiv ul").sortable({ opacity: 0.6, cursor: 'move', update: function(){
        var order = $(this).sortable("serialize") + '&action=update'; 
        $.post("updatelist.php", order, function(){
        });                                                              
    }                                 
    }); // listdiv ul end

并使该 ul 中的所有列表项可拖动，以便我可以拖动和丢弃：

    $("#listdiv li").draggable({
        opacity : 0.7,
        revert  : 'invalid',
                helper  : 'clone',
                zIndex  : 100,
                cursor  : 'move'
        });

只要我不包含上面使

的部分，排序就可以工作是可拖动的。添加该功能后，我可以拖动它们并将其丢弃，但列表项不再可排序。

请问我有什么不好吗？

谢谢， 史蒂夫

注意：我不知道回答自己问题的协议，所以我只是编辑我原来的问题！如果我这样做错了，请有人打我。

解决上述问题的方法：

睡了一觉后，我想“为什么还要费心制作我的可排序列表

< /code> 可拖动并使我的垃圾桶可投放？”

我只是让我的垃圾桶可排序，并在我的列表 div 和垃圾 div 上使用 connectwith 并设置一个接收事件处理程序，这应该可以工作吗？让我们看看...

$("#trash").sortable({

      connectWith: '#listdiv',
      receive: function(event, ui)
      {
     var $element = ui.item;
//        alert ( $element.attr('id') ) ;

        // remove this from original list
        $element.remove();

    //remove this item from trash list
    $("#trash li").remove(),

        // remove from database
    $.ajax({                                      
            url: 'deltask.php',                          
            data: 'id='+$element.attr('id'),            
            dataType: 'html',                   
            success: function(data)          
            {
            //  alert(data);
            }
    });

      } // end receive
}); // end trash



// set our listdiv ul as sortable 
$("#listdiv ul").sortable({
    opacity: 0.6,
    cursor: 'move',
    connectWith: '#trash',
    update: function()
        {
            var order = $(this).sortable("serialize") + '&action=update'; 
            $.post("updatelist.php", order, function(){
            });      
        }   
}); // end  listdiv ul sortable

我的原始列表排序良好，我可以将列表项拖到垃圾“列表”中，然后在它从原始列表、垃圾列表和我的数据库到达时将其删除（）。

也许不太优雅，但是嘿，它有效。