jQuery Sortable + Droppable. Après la chute, mon LI est enveloppé dans un autre LI

Question

Ceci est mon code pour un draggable connecté à un sortable. La chose est, je crée un LI avec un tas d'attributs. MAIS quand je fais glisser un élément vers la div droppable, le sortable crée une nouvelle balise li et enveloppe ma li créée avec elle.

Il ressemble à ceci:

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

Alors que mon intention est d'avoir quelque chose comme ceci:

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

Alors, comment puis-je faire?

Et le code:

$(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>') 
    } 
}); 

}); 

Answer 1

Essayez d'utiliser ceci:

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