2012-01-05 21 views
13

In una tabella html ho in ogni riga una cella con il proprio numero di posizione. Come posso aggiornare correttamente questo numero di posizione dopo l'ordinamento con jQueryUI?jQuery ui ordinabili tablerows numero di aggiornamento posizione all'interno di

Questa è la mia semplice 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> 

E questo è il mio js:

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

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

Ora vorrei cambiare l'ordine posizionare i valori numerici dopo la completa ordinamento correttamente.

Come posso fare questo?

Qualsiasi aiuto sarebbe apprezzato.

risposta

22

Procedere come segue dopo la cernita ..

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

si può provare (non testata): invece di $('table tr').each uso $(this).parents('table').find('tr').each

Spiegazione .. Si scorre ciascuno dei tr tag all'interno di tavolo e quindi cambia il contenuto del primo td-child con il valore dell'indice tr

+2

Grazie mille, buona risposta e buona spiegazione, funziona perfettamente. Accetto e voto per la tua risposta, puoi fare lo stesso per la mia domanda se vuoi. Molte grazie! – bobighorus

+2

Mi ha aiutato anche io - ottima risposta e domanda – cantera

2

Se a qualcuno è piaciuto l'abo Ho risposto come ho fatto, ecco il Coffeescript

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