jquery: cómo actualizar la Id. De clon arrastrable?

Question

Quiero añadir elementos que pueden arrastrarse a una lista ordenable, que funciona muy bien en mi ejemplo en http://jsbin.com/ipese5/35

El problema es que quiero actualizar id del elemento clonado cuando se arrastran a la lista se puede ordenar. Lo curioso es que el siguiente código actualiza el ID a "nueva identificación" en el objeto de ui (como puedo ver en mi consola), pero la identificación no se cambia en la página html real. Alguien tiene una solución?

$("#init .block").draggable({ 
    helper: "clone", 
    connectToSortable: ".list" 
}); 

$(".list").sortable({ 
    connectWith: ".list", 
    receive: function(event, ui) { 
    $(ui.helper).attr("id","new-id"); 
    console.log(ui); 

    // surprisingly the next line works fine, but is not neccesary 
    // $(ui.item).attr("id","new-id"); 
    } 
}); 

<div id="init"> 
    <div id="new" class="block">Drag me</div> 
    <div id="new" class="block">Drag me</div> 
    <div id="new" class="block">Drag me</div> 
</div> 

<div class="list"> 
    <div class="block">Sort me</div> 
    <div class="block">Sort me</div> 
</div> 

Answer 1

En el caso receive, no se puede acceder al artículo, de lo que se está creando en la lista se puede ordenar. Helper apunta a un clon que se usa solo para arrastrar, el elemento es el elemento original en el que hizo clic para arrastrar.

Pero, el evento beforeStop se dispara justo antes del evento de recepción. En beforeStop, el elemento es realmente el elemento que se agrega a la lista. Por lo tanto, en BeforeStop puede guardar el elemento y luego usarlo en Recibir.

demo aquí: http://jsfiddle.net/kcg29/

var newItem; 

$(".list").sortable({ 
    connectWith: ".list", 
    beforeStop: function (event, ui) { 
     newItem = ui.item; 
    }, 
    receive: function(event,ui) { 
     $(newItem).doSomething(); 
    } 
});​ 

Answer 2

Es muy sencillo, pero funciona:

$('#init .block').draggable({ 
     connectToSortable: ".list", 
     helper: "clone", 
     start: function(event,ui){ 
      //get ID form draggable item 
      itemId = $(this).attr('id'); 
     }, 
     stop: function(event,ui){ 
      //assign ID to clone 
      ui.helper.attr('id',itemId); 
     } 
    }); 

$(".list").sortable({ 
    connectWith: ".list", 
});