Как я могу получить текущий идентификатор строки в HTML-таблице Firebase для выполнения функции

Question

Вот мой код и он делает то, что он извлекает данные из базы данных Firebase и отображает их в таблице HTML, используя javascript (плюс небольшую штуку jquery)

<table class="table" id="ex-table">
  <thead>
    <tr>
      <th scope="col">Nom</th>
      <th scope="col">Prénom</th>
      <th scope="col">N° CIN</th>
      <th scope="col">Tel</th>
      <th scope="col">Position</th>
      <th scope="col">Photo d'accident</th>
      <th scope="col">Etat</th>
      <th scope="col">Options</th>
    </tr>
  </thead>
<tbody>
          <script>
      var database = firebase.database();
      database.ref('declaration').once('value', function(snapshot) {
        if (snapshot.exists()) {
          var content = '';
          snapshot.forEach(function(data) {
            var val = data.val();
            content += '<tr>';
            content += '<td>' + val.firstName + '</td>';
            content += '<td>' + val.lastName + '</td>';
            content += '<td>' + val.cin + '</td>';
            content += '<td> 1234 </td>';
            content += '<td> lng lat </td>';
            content += '<td>' + val.photo + '</td>';
            content += '<td>' + val.etat + '</td>';
            content += '<td> ACTION BUTTON TO THESE VARIABLES IN THIS ROW </td>';
            content += '</tr>';
          });
          $('#ex-table').append(content);
        }
      });
    </script>
  </tbody>
</table>

Дело в том, что я хочупоставить кнопку действия «onclick», чтобы обновить строку в базе данных.

Вот как выглядит моя таблица: Я не знаю, как настроить функцию, которая работаетс текущими переменными строки с помощью firebase в таблице этого типа

Answer 1

Вы можете использовать key каждой записи, чтобы получить конкретный идентификатор строки, передать его на onclick кнопки действия.Вы можете попробовать что-то вроде этого

 <script>
    function actionCb(e){
        console.log('e',e.id)
     }
</script>

<table class="table" id="ex-table">
  <thead>
    <tr>
      <th scope="col">Nom</th>
      <th scope="col">Prénom</th>
      <th scope="col">N° CIN</th>
      <th scope="col">Tel</th>
      <th scope="col">Position</th>
      <th scope="col">Photo d'accident</th>
      <th scope="col">Etat</th>
      <th scope="col">Options</th>
    </tr>
  </thead>
<tbody>
          <script>
      var database = firebase.database();
      database.ref('declaration').once('value', function(snapshot) {

        if (snapshot.exists()) {
          var content = '';
          var snapValues = snapshot.val()
          var values = Object.keys(snapValues).map(function(key){ return {key, ...snapValues[key]}})
          values.forEach(function(data) {
            var val = data; 
            var fbKey = data.key
            content += '<tr>';
            content += '<td>' + val.firstName + '</td>';
            content += '<td>' + val.lastName + '</td>';
            content += '<td>' + val.cin + '</td>';
            content += '<td> 1234 </td>';
            content += '<td> lng lat </td>';
            content += '<td>' + val.photo + '</td>';
            content += '<td>' + val.etat + '</td>';
            content += '<td> <button id="'+ fbKey+'" onclick="actionCb(this)">action</button> </td>';
            content += '</tr>';
          });
          $('#ex-table').append(content);
        }
      });
    </script>
  </tbody>
</table>