jQuery ordenable obtener .index() antes y después de la clasificación?

Question

Estoy usando la ordenación de jQuery en un complemento de etiquetado, El complemento mantiene una matriz de objetos que se relacionan con li en el mismo orden que los elementos reales.

Necesito actualizar el orden de los elementos en la matriz cuando termina la clasificación.

Pensé que podría simplemente en el evento de inicio llamar al $(ui).index() y en el evento de actualización llamar al mismo que me daría la posición inicial, y la posición final, pero ambas llamadas devuelven -1.

¿Cómo debo hacer esto?

---

Estructura:

<ul> 
<li>here<a class="close">x</a></li> 
<li>are<a class="close">x</a></li> 
<li>some<a class="close">x</a></li> 
<li>tags<a class="close">x</a></li> 
</ul> 

Matriz Estructura:

[{ 
    label: 'here', 
    value: 36, 
    element: '$(the li that this info is about)', 
    index: 0 
}, 
{ 
    label: 'are', 
    value: 42, 
    element: '$(the li that this info is about)', 
    index: 1 
}, 
{ 
    label: 'some', 
    value: 21, 
    element: '$(the li that this info is about)', 
    index: 2 
}, 
{ 
    label: 'tags', 
    value: 26, 
    element: '$(the li that this info is about)', 
    index: 3 
}] 

JavaScript:

$('ul').sortable({ 
    start: function(event, ui){...}, 
    update: function(event, ui){...} 
}); 

Answer 1

si .index() está volviendo - 1, eso sugeriría que está haciendo esa solicitud antes de que el elemento esté disponible para el DOM. o ha etiquetado mal un selector y nuevamente no existe @ tiempo de llamada o está vacío en relación con la función .index()

Answer 2

puede asociar algunos datos con cada elemento de la lista para hacer un seguimiento de ellos como este :

<ul id="sortable"> 
<li data-id="1" class="ui-state-default">1</li> 
<li data-id="2" class="ui-state-default">2</li> 
<li data-id="3" class="ui-state-default">3</li> 
</ul> 

a continuación, puede acceder a estos datos a través de jQuery como esto:

$('ul li:nth-child(0)').data('id'); 
$('ul li:nth-child(1)').data('id'); 
$('ul li:nth-child(2)').data('id'); 

Answer 3

 
$(function() { 
    $("#sortable").sortable({ 
     update: function(event, ui) { 
      console.log('update: '+ui.item.index()) 
     }, 
     start: function(event, ui) { 
      console.log('start: ' + ui.item.index()) 
     } 
    }); 
    $("#sortable").disableSelection(); 
});