Question

该表显示“无可用数据”，但数据已附加在表内部 TableImage [1]

这是我的html代码：

<div class="box box-success">
    <div class="box-header">
      <h3> Sales </h3> 
          <table id="orders" class="table table-bordered table-striped">
            <thead>
            <tr>
                <th>ID</th>
                <th>Product</th>
                <th>Price</th>
                <th>Quantity</th>
                <th>Date Ordered</th>
                <th>Date Delivered</th>
                <th>Status</th>
            </tr>
            </thead>
            <tbody id="example">   
            </tbody>
        </table>
    </div>
  </div>

我的JavaScript代码：

 $('#orders').dataTable();
 var rootRef = firebase.database().ref().child("sales/");
 rootRef.on("child_added", snap => {
     var key = snap.key;
     var product = snap.child("product").val();
     var price = snap.child("price").val();
     var quantity = snap.child("quantity").val();
     var date_ordered = snap.child("date_ordered").val();
     var date_delivered = snap.child("date_delivered").val();

     $("#example").append("<tr id='" + key + "'><td>" + key + "</td><td>" +
         product + "</td><td>" + price + "</td><td>" + quantity + "</td><td>" +
         date_ordered + "</td><td>" + date_delivered + "</td><td>" +
         "<a href = 'product_list.html' > View < /a></td > < /tr>");
 });

有人可以帮助我吗？请..：（

Answer 1

我对您的代码有一些改进，您可以在下面查看。我认为您应该先尝试使其与原始HTML表一起使用，然后再使用dataTable插件。我不知道您使用的是哪个dataTable插件，但也许您得到了“无可用数据”，因为在您初始化该插件时，您的表为空。

var rootRef = firebase.database().ref().child("sales/");
rootRef.on("child_added", snap => {
     var row = snap.val();
     var key = snap.key;
     var product = row.product;
     var price = row.price;
     var quantity = row.quantity;
     var date_ordered = row.date_ordered;
     var date_delivered = row.date_delivered;

     $("#example").append("<tr id='" + key + "'><td>" + key + "</td><td>" +
         product + "</td><td>" + price + "</td><td>" + quantity + "</td><td>" +
         date_ordered + "</td><td>" + date_delivered + "</td><td>" +
         "<a href = 'product_list.html' > View < /a></td > < /tr>");
 });

使用Firebase将数据附加到数据表

1 个答案: