td 삭제 및 셀 데이터 변경

Question

많은 행이있는 테이블이 있습니다. 각 행은 UI에서 1, 2, 3 등과 같은 주문 번호로 식별됩니다.이 주문 번호는 UI에도 표시됩니다. 둘째 행이 삭제되면

행 삭제

이 순서는 동적

변경한다. 그런 다음 다른 행을 1, 2, 3 등과 같이 순서대로 다시 정렬해야합니다.

어떻게하면됩니까?

Answer 1

당신은 행의 삭제에 이런 식으로 뭔가를 실행할 수 있습니다 :

이

$("tr").click(function() { 
    var $table = $(this).closest('table'); 
    $(this).remove(); 
    $table.find('tr > td:first-child').map(function() { 
     $(this).html($(this).closest('tr')[0].rowIndex + 1); 
    }); 
}); 

데모 : http://jsfiddle.net/karim79/E5bCr/

Answer 2

데모가 좋다. 하지만 질문은 테이블에서 번호 매기기 순서를 다시 지정하는 방법이라고 생각합니다. 나는 다른 방식으로 이와 비슷한 방법을 사용 했었지만 .. 번호 매기기를 다시 주문하는 법을 찾지 못했지만 대신 테이블 내용이 데이터베이스에서 나온 것입니다. 데이터베이스에서 다시 쿼리하고 모든 레코드를 가져옵니다.

$("#my_table tbody").find("tr").remove(); //remove the tr's from below tbody 
$.getJSON("file.php",function(json){ 
ctr = 1; 
for(i=0;i<json.length;i++){ 
$('#my_table tbody:first').append('<tr><td>'+ctr+'</td></tr>'); 
ctr++; 
}); 

이것은 임시 해결책입니다.

Answer 3

<script> 
    var gCounter = 1; // global 
    $('table').bind('row_deleted', 
     function() { 
      gCounter = 1; // reset 
      $(this).find('tbody tr').each(
       function() { 
        $(this).find(':first-child').html(gCounter++); 
       }); 
     }); 

    $('#your_table').trigger('row_deleted'); 

</script>