Предположим, у меня есть таблица HTML, и в каждой строке есть некоторые данные, кнопка «Обновить» и «Удалить». Я хочу, нажав на кнопку «Обновить», получить все данные, которые есть в этой конкретной строке. Я искал другие примеры, но большинство из них просто просматривали столбец с помощью идентификатора столбца и просто печатали все найденные ячейки. После нажатия кнопки обновления мне нужно получить все текущие данные ячейки, которые есть в этой строке. Как я могу это сделать?

Дж.С. Фиддл ЗДЕСЬ

Could not properly indent code after trying for more than 30mins so I gave up
2
ceid-vg 30 Авг 2017 в 00:00

2 ответа

Ответ от @gaetanoM будет принятым. Если кому-то нужен способ не только получить только идентификатор, но и полные данные строки, вы можете попробовать это:

КОД HTML:

Измените это:

<td>1</td>
<td>John</td>
<td>John</td>
<td>vas@gmail.com</td>
<td>1976</td>
<td>USA</td>
<td>Michigan</td>

на это:

<td class="table_id">23</td>
<td class="table_firstName">John</td>
<td class="table_lastName">John</td>
<td class="table_email">vas@gmail.com</td>
<td class="table_born">1976</td>
<td class="table_country">USA</td>
<td class="table_departmentId">Michigan</td>

КОД JAVASCRIPT:

Измените это:

$('#employees-table tbody button.btn.btn-warning').on('click', function(e) {
    var row = $(this).closest('tr');
    console.log('TR first cell: ' + row.find('td:first').text());
})

на это:

$('#employees-table tbody button.btn.btn-warning').on('click', function(e) {
    var id = $(this).closest('tr').find('.table_id').text();
    console.log("Id = " + id);
    var firstname = $(this).closest('tr').find('.table_firstName').text();
    console.log("First Name = " + firstname);
    var lastname = $(this).closest('tr').find('.table_lastName').text();
    console.log("Last Name = " + lastname);
    var email = $(this).closest('tr').find('.table_email').text();
    console.log("Email = " + email);
    var born = $(this).closest('tr').find('.table_born').text();
    console.log("Born = " + born);
    var country = $(this).closest('tr').find('.table_country').text();
    console.log("Country = " + country);
    var department = $(this).closest('tr').find('.table_departmentId').text();
    console.log("Department = " + department);
})

Смотрите результаты в ЭТОМ фиддле.

Еще раз спасибо всем, кто помог найти ответ !!!

0
ceid-vg 29 Авг 2017 в 21:58

Чтобы получить данные в строке после нажатия кнопки Обновить

<button type="button" class="btn btn-warning" onclick="getData(this)">

window.getData = function(val) {
  let arr= [];

  val.parentNode.parentNode.querySelectorAll('td').forEach(item=>{
    if (item.getAttribute('class') != "text-center") {
      arr.push(item.innerHTML)
    }
  },this)
  console.log(arr); //["1", "John", "John", "vas@gmail.com", "1976", "USA", "Michigan"]
}
1
AkeRyuu 29 Авг 2017 в 21:21