Jquery UI 结合了可排序和可拖动

Question

我正在尝试组合一个可拖动面板(顶部)和一个可排序面板(底部)。

拖动工作正常，但排序失败。

这是我的 JS fiddle : http://jsfiddle.net/dmUKY/9/

拖放和可排序函数共享 droppable:drop 函数。 对元素进行排序时，该函数必须替换所选对象。

 drop: function (event, ui) {
    //alert($(this).parent().html());
    //alert($(ui.helper).attr('class'));
    var obj;
    if ($(ui.helper).hasClass('draggable')) {
        //alert('draggable');
      obj = $(ui.helper).clone();  
      obj.removeClass('draggable').addClass('editable')
      //obj.addClass('droppable');
      $(this).parent().append(obj);

    }


    //alert($(this).parent().html());
}

我应该如何结合这两个功能？

Answer 1

$("#sortable").sortable({
    revert: true,
    stop: function(event, ui) {
        if(!ui.item.data('tag') && !ui.item.data('handle')) {
            ui.item.data('tag', true);
            ui.item.fadeTo(400, 0.1);
        }
    }
});
$("#draggable").draggable({
    connectToSortable: '#sortable',
    helper: 'clone',
    revert: 'invalid'
});
$("ul, li").disableSelection();

<强> DEMO JSFIDDLE

我想这就是您要找的!!