Vị trí số làm mới có thể sắp xếp của jQuery ui sắp xếp bên trong

Question

Trong bảng html, tôi có trong mỗi hàng một ô có số vị trí riêng. Làm thế nào tôi có thể làm mới số vị trí này một cách chính xác sau khi sắp xếp với jQueryUI?

Đây là html đơn giản của tôi:

<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> 

Và đây là js của tôi:

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

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

Bây giờ tôi muốn thay đổi trật tự một cách chính xác vị trí của các giá trị số sau khi sắp xếp xong.

Tôi làm cách nào để thực hiện việc này?

Mọi trợ giúp sẽ được đánh giá cao.

Answer 1

Làm như sau sau khi phân loại ..

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

bạn có thể thử (chưa được kiểm tra): thay vì $('table tr').each sử dụng $(this).parents('table').find('tr').each

Giải thích .. Nó vòng qua từng tr thẻ trong bảng và sau đó thay đổi nội dung của td-child đầu tiên bằng giá trị chỉ số của tr

Answer 2

Nếu ai đó thích abo đã trả lời như tôi đã làm, đây là Coffeescript

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