При добавлении строки динамическая нумерация строк таблицы

Question

Пытаюсь сделать динамическая нумерация строк таблицы при их добавлении. Но функция не работает, к каждой строке присваивается 0. Ни как не могу понять в чем проблема. Использую этот код.

function updateTableNumeration() {
    $('.table tbody tr').each(function(i) {
          $(this).find('td:first').text(i+".");
    });
}    


$.ajax({
    success: function (res) {
        updateTableNumeration();
    }
});

Answer 1

Если я правильно понял проблему.

// ссылка на таблицу
const table = document.querySelector('table');

// Добавляем строки и столбцы в таблицу
function appendRows() {
  const countRows = document.querySelectorAll('tr').length;

  const row = table.insertRow();
  const cell = row.insertCell();

  cell.appendChild(document.createTextNode(countRows + 1));

}

// Добавляем выволнение функции по клику на кнопку
document.querySelector('#btn').addEventListener('click', () => {
  appendRows();
});

#btn {
  padding: 10px;
  text-align: center;
  background: #d6d9dc;
  cursor: pointer;
  border: 1px solid black;
}

#btn:hover {
  background: grey;
}

<div id="btn">
  Добавить
</div>

<table>
  <tr>
    <td>1</td>
  </tr>
  <tr>
    <td>2</td>
  </tr>
  <tr>
    <td>3</td>
  </tr>
</table>

Вам необходимо это весь подобный код делать после каждой перерисовки таблицы или содержимого таблицы.

Answer 2

Вероятно, Вы используете неправильный селектор '.table tbody tr'.

function updateTableNumeration() {
  $('.table tbody tr').each(function(i) {
    $(this).find('td:first').text(i + 1 + ".");
  });
}

updateTableNumeration();

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table class="table" border=1>
  <tr><td/><td>AAA</td><td>BBB</td></tr>
  <tr><td/><td>AAA</td><td>BBB</td></tr>
  <tr><td/><td>AAA</td><td>BBB</td></tr>
  <tr><td/><td>AAA</td><td>BBB</td></tr>
  <tr><td/><td>AAA</td><td>BBB</td></tr>
  <tr><td/><td>AAA</td><td>BBB</td></tr>
</table>

БЛОГ НА HUSL

При добавлении строки динамическая нумерация строк таблицы

Ответы (2 шт):