javascript - 表将无法使用 Firebase 生成

问题描述

这是一个网络应用程序，它将接受我正在使用 firebase 的调查。我需要帮助的是，当应用程序将数据导出到表中时，它会抓取数据但无法将其推送到表中，任何帮助将不胜感激。由于 HTML 代码很长，我只放表格部分：HTML 文件的表格部分

   <div id = "table">
   <pre id =  "snap-test"></pre>
  <table id ="File-Table" class="table">
         <thead>
          <tr>
          '<td><button onclick = "DeleteTabele()" id = "Delete-btn">Delete File</button></td>'
          </tr>
        </thead>
        <button onclick ="Return()" id= "Log-btn" type="submit" class="btn btn-">Add a new File</button>
      </table>
    </div>

Table.js 文件

 var table = document.getElementById("File-Table");
  const file = $("#File").val();
  var requests = [];
function Export(){
    //calls the file id in the HTML element 
  $("#Survey-Page").hide();
  $("#File-Table").show();
  $("#Log-btn").show();
  var result = [];
//calls the database from the firebase known as users then using a function we nest a snapshot in it for later 
  firebase.database().ref('/users/').once('value').then(function(snapshot){
  //if snapshot is empty then the window will alert 
   if (snapshot.val() == null){
        alert("Does not exist");
   }
   // if the snapshot is full then it will genereate a table based on the snapshot value of the database 
    else {
      console.log(snapshot.val());

        let result = snapshot.val()
      for(let k in result){
        this.requests.push({
          id: k,
          value: result[k]
        });
      }
     var MyTable = '<tr>' +
          '<td>' + snapshot.val().txtName  +'</td>' +
          '<td>' + snapshot.val().txtEmail +'</td>' +
          '<td>' + snapshot.val().FileName + '</th>' +
          '<td><button id = "Email-btn">Send Survey</button></td>' +
          '<td><button onclick = "DeleteTabele()" id = "Delete-btn">Delete File</button></td>' +
            '</tr>';
     MyTable += "</tr></table>";
      table.innerHTML = MyTable;

    }

    console.log(snapshot.val());

  });

标签： javascriptfirebasefirebase-realtime-database

从您发布的代码来看，更可能的原因是您的引用引用了多个用户的节点，而不是特定用户。

firebase.database().ref('/users/')

为了确认这个假设，我们需要查看您的数据库结构。你能编辑你的帖子吗？

但是，让我们假设这个假设是正确的。那么你有两个解决方案：

如果要显示users节点下的 ONE 用户的值，则必须更改引用并指向该用户，例如：

firebase.database().ref('/users/' + userID)

那么剩下的代码就可以正常工作了

如果要在表中显示整个用户列表（逐行），则必须遍历查询结果，如下所示：

firebase.database().ref('/so').once('value').then(function(snapshot){
var MyTable;

snapshot.forEach(function(childSnapshot) {
    MyTable += '<tr>' +
        '<td>' + childSnapshot.val().txtName +'</td>' +
        '<td>' + childSnapshot.val().txtEmail +'</td>' +
        // ...
        '<td><button id = "Email-btn">Send Survey</button></td>' +
        '<td><button onclick = "DeleteTabele()" id = "Delete-btn">Delete File</button></td>' +
        '</tr>';
     });
     table.innerHTML = MyTable;
});

请参阅此处的文档：https ://firebase.google.com/docs/database/web/lists-of-data#listen_for_value_events

另外，如果可以的话，您可以看看这篇 SO 帖子：HTML：使用 innerHTML 绘制表格，其中展示了一些用“简单”JavaScript 编写表格行的最佳实践。

javascript - 表将无法使用 Firebase 生成

问题描述

解决方案

推荐阅读