jQuery 드래그/드롭 예 : 순서가 지정된 목록이 대상에서 순서가 지정된 목록처럼 보이지 않습니다.

Question

드래그 앤 드롭 할 수 있습니다. 매우 효과적입니다. 그러나 목적지 장소에서 주문 목록은 제대로 작동하지 않습니다. 더미처럼 보이지 않는 정렬 된 목록처럼 보일 것입니다. 대상 상자는 새 요소로 커야하지만 작동하지 않습니다.

내 실수는 어디에서 왔습니까? http://jsfiddle.net/QJ54x/

지금까지 jQuery를-코드입니다 :

$(init); 
function init() {   
    $('.draggable1').draggable ({ 
     containment: "#ddSurvexFormDragDropArea", 
     scope: "d1", 
     stop: draggable1Stop, 
     helper: "clone", 

    }); 

    $('#droppable1').droppable({ 
     scope: "d1", 
     accept: ".draggable1", 
     hoverClass: "droppable1HoverClass", 
     drop: droppable1Drop, 
    }); 
} 

function draggable1Stop(event,ui) { 
    // alert ('draggable1Stop'); 
    // $(this).remove(); 
    ui.helper.clone().appendTo($(this).parent()); 
    $(this).remove(); 
} 

function droppable1Drop (event, ui) { 

} 

Answer 1

OK 대답은 (다른 간단한 예) 나는 그것을 가지고, 여기에 있습니다 :

http://jsfiddle.net/cKs5u/

여기에 코드입니다 그 부분은 다음과 같습니다.

$("#cart ol").droppable({ 
    activeClass: "ui-state-default", 
    hoverClass: "ui-state-hover", 
    accept: ":not(.ui-sortable-helper)", 
    drop: function(event, ui) { 
     $(this).find(".placeholder").remove(); 
     $("<li></li>").text(ui.draggable.text()).appendTo(this); 

    } 
}) 

jquery-api online의 샘플.