将数据添加到数据表，引导

Question

我需要知道如何从数据库将数据添加到数据表，引导

这是我的表：

<div class="container"> 
<button id="addRow">Add new row</button> 
<table id="example" class="display" cellspacing="0" width="100%"> 
    <thead> 
     <tr> 
      <th>Column 1</th> 
      <th>Column 2</th> 
      <th>Column 3</th> 

     </tr> 
    </thead> 
</table> 
</div> 

我有一个脚本，从我的数据库中的数据添加自动数据表的自举

<script> 
var tblusuario = document.getElementById('example'); 
var databaseRef = firebase.database().ref('Usuarios/'); 
//var databaseRef = FirebaseFirestore.database().ref('/users'); 
var rowindex = 1; 

databaseRef.once('value', function(snapshot) { 
    snapshot.forEach(function(childSnapshot) { 

     var childKey = childSnapshot.key; 
     var childData = childSnapshot.val(); 

     var row = tblusuario.insertRow(rowindex); 
     var cellIndice= row.insertCell(0); 
     var cellId = row.insertCell(1); 
     var cellNombre = row.insertCell(2); 


     cellIndice.innerHTML=rowindex; 
     cellId.appendChild(document.createTextNode(childKey)); 
     cellNombre.appendChild(document.createTextNode(childData.usuario)); 

      rowindex = rowindex + 1; 


    }); 
}); 

乙UT表不承认它，我不能使用使用DataTable中

See the table

的功能在此之后，我已经3天学习更改代码把它放在桌子

我已经把这个参考（那有什么？）

<button id="addRow">Add new row</button> 
    <script> 

    $(document).ready(function() { 
    var t = $('#example').DataTable(); 
    var counter = 1; 

    $('#addRow').on('click', function() { 
    t.row.add([ 
     counter +'.1', 
     counter +'.2', 
     counter +'.3', 

    ]).draw(false); 

     counter++; 
    }); 

    // Automatically add a first row of data 
    $('#addRow').click(); 
    }); 

到目前为止，我想重构米而Y码为了funtion到dataTable的

我有这个，但它doesn't工作:(

<script> 


$(document).ready(function() { 
var t = $('#example').DataTable(); 
var counter = 1; 
var databaseRef = firebase.database().ref('Usuarios/'); 
var rowindex = 1; 
databaseRef.once('value', function(snapshot) { 
snapshot.forEach(function(childSnapshot) { 
var childKey = childSnapshot.key; 
var childData = childSnapshot.val(); 

var addhere = childKey; 
var b = childData.usuario; 

      }); 
    }); 

    $('#addRow').on('click', function() { 

    t.row.add([ 
     addhere,//PROBLEM 
     'hola', 
     '.3', 
    ]).draw(false); 


    }); 

    // Automatically add a first row of data 
    $('#addRow').click(); 
}); 

有人能帮助我的代码？ 谢谢

Answer 1

通过看你的代码似乎你使用Firebase JavaScript client SDK。因此，您可以从Firebase中检索数据，然后将其注入DataTable。

databaseRef.once('value', function(snapshot) { 
    $('#example').DataTable({ 
    data : snapshot.val() 
    }); 
}); 

你必须记住，这是由火力发送数据应与DataTables Data source types 背景下一件事情，否则你必须使用columns.data或columns.render修改接收到的数据。