jQuery ui sortable tablerows actualice la posición número dentro de

Question

En una tabla html tengo en cada fila una celda con su propio número de posición. ¿Cómo puedo actualizar este número de posición correctamente después de ordenar con jQueryUI?

Ésta es mi simple html:

<table border="0"> 
<thead> 
     <tr> 
     <th scope="col">Position number</th> 
     <th scope="col">Name</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr> 
     <td>1</td> 
     <td>Text</td> 
     </tr> 
     <tr> 
     <td>2</td> 
     <td>Text</td> 
     </tr> 
    </tbody>   
</table> 

y este es mi JS:

var fixHelper = function(e, ui) { ui.children().each(function() { $(this).width($(this).width()); }); return ui; }; 

    $("table tbody").sortable({ 
     helper: fixHelper 
    }).disableSelection(); 

Ahora me gustaría cambiar para posicionar correctamente los valores de número después de la clasificación completa.

¿Cómo puedo hacer esto?

Cualquier ayuda sería apreciada.

Answer 1

Haz lo siguiente después de la clasificación ..

$("table tbody").sortable({ 
    update: function(event, ui) { 
     $('table tr').each(function() { 
      $(this).children('td:first-child').html($(this).index()) 
     }); 
    }, 
    helper: fixHelper 
}).disableSelection(); 

puede probar (no probado): en lugar de $('table tr').each uso $(this).parents('table').find('tr').each

Explicación .. Se coloca a través de cada una de las etiquetas dentro tr mesa y luego cambia el contenido de la primera td-child con el valor de índice de tr

Answer 2

Si a alguien le gustaba la abo ve respuesta como lo hice, aquí está el Coffeescript

jQuery -> 
    $("ul.sortableEdit").sortable 
      stop: (event, ui) -> 
      $('ul.sortableEdit li').each(-> 
       $(this).children('input.sortableItemPos').val($(this).index()) 
      )