2009-04-19 12 views
2

これは、ソート可能に接続されたドラッグのための私のコードです。事は、私は属性の束とLIを作成しています。しかし、アイテムをドラッグ可能divにドラッグすると、ソート可能な新しいliタグが作成され、作成されたliがそのアイテムにラップされます。jQuery Sortable + Droppable。ドロップ後、私のLIは別のLIの中にラップされます

それはこのようなものになります。

<ul> 
    <li class="X" onclick="myFunc()"> My LI</li> 
</ul> 

ので、私はこれをどのように行うか:私の意図は、このような何かを持っていることであるが

<ul> 
<li class="ui-draggable" style="display: list-item;"> 
    <li class="X" onclick="myFunc()"> My LI</li> 
<li> 
</ul> 

を?

とコード:

$(document).ready(function() { 

$('.draggable_text > li').draggable({ 
    helper: function(event, ui) { 
     return '<div class="placeholder_sortable">&nbsp</div>' 
    }, 
    connectToSortable:'#stagerows' 
}); 

$('#stagerows').sortable({ 
    handle: '.drag_handle', 
    placeholder: 'placeholder_sortable' 
}); 

/** 
* When item is dropped from the Add <Stuff> 
*/ 
$('#stagerows').droppable({ 
    drop: function(event, ui){ 
     return ui.draggable.html('<li class="X" onclick="myFunc()"> My LI</li>') 
    } 
}); 

}); 

答えて

3

これを使用してみてください:

$('#stagerows').droppable({ 
    drop: function(event, ui){ 
     return ui.draggable.html('My LI').addClass('X').click(myFunc); 
    } 
}); 
+0

感謝tvanfosson。しかし、コードの外観では、私が作成したliタグを削除する必要があります。 return ui.draggable.html(createHTML()); //上記のコードは、HTMLを明示的に追加して読みやすくしています。 – wenbert

関連する問題