L'oggetto clone non è trascinabile

Question

Sto cercando di clonare un oggetto trascinabile utilizzando Jquery ma l'oggetto clonato non è trascinabile.

$(document).ready(function(){
$("input[value='Add']").click(function(e){
e.preventDefault();
$("div.field:last").clone().insertAfter("div.field:last");
});

$(".field").droppable();

HTML

<div class="field">
Last Name<input type="text" value="" />
First Name<input type="text" value="" />
</div>
<div class="field">
Last Name<input type="text" value="" />
First Name<input type="text" value="" />
</div>
<input type="Submit" name="submit" value="Add" /> 

Firebug mostra che l'oggetto clonato ha anche la classe riutilizzabile, hai idea del perché non funzionerebbe?

Modifica
L'impostazione di bool (true) o il concatenamento dell'oggetto clonato con .droppable () non funziona neanche

Answer 1

Ho scoperto un modo per ottenere questo risultato, usando il .live, sto usando un plugin .livequery che funziona in modo abbastanza simile a .live

  

Quando associ un " live " l'evento si legherà a tutti gli elementi attuali e futuri della pagina

$("input[value='Add']").livequery("click", function(e){
e.preventDefault();
$("div.field:last").clone().insertAfter("div.field:last");
$("div.field").droppable();

Answer 2

Devi copiare gli eventi sul clone; passa true a clone() :

$("div.field:last").clone(true).insertAfter("div.field:last");

---

Potrebbe anche essere necessario copiare alcuni dati dall'originale:

var original = $("div.field:last");
var clone = original.clone(true);
clone.data( 'droppable', jQuery.extend(true, {}, original.data('droppable')) );
/* Untested! */