firebase Cloudfirestore:用javascript添加自动数据

lf5gs5x2  于 2023-04-12  发布在  Java
关注(0)|答案(1)|浏览(105)

如何在将数据添加到cloudfirestore时,使用自动LABEL标记创建更多TD标记,并使用javascript在表中显示。

</div>
    <a href="home.html"><button id="btn_home">Home</button></a>
<div class="content">
    <table>
        <tr>
            <th><span>Codigo</span></th>
            <th><span>Nombre</span></th>
            <th><span>Telefono</span></th>
            <th><span>Direccion</span></th>
            <th><span>Forma de pago</span></th>
            <th><span>Calidad</span></th>
            <th><span>Talla</span></th>
            <th><span>Disponibilidad</span></th>
        </tr>
        <tr>
            <td><label type="text" id="label_codigo"></label></td>
            <td><label type="text" id="label_nombre"></label></td>
            <td><label type="number" id="label_telefono"></label></td>
            <td><label type="text" id="label_direccion"></label></td>
            <td><label type="text" id="label_forma_de_pago"></label></td>
            <td><label type="text" id="label_calidad"></label></td>
            <td><label type="text" id="label_talla"></label></td>
            <td><label type="number" id="label_disponibilidad"></label></td>
        </tr>
    </table>
    <button id="show" onclick="mostrarAgregar();">Mostrar ventana de agregar</button>
</div>
tkqqtvp1

tkqqtvp11#

//Variable para leer los datos de la base de datos
var collectionRef = firebase.firestore().collection('Proveedores');
// Obtener los datos de la colección
collectionRef.get().then(function(querySnapshot) {
  querySnapshot.forEach(function(doc) {
    // Obtener el campo específico que deseas mostrar
    var Codigo = doc.data().Codigo
    var Nombre = doc.data().Nombre
    var Telefono = doc.data().Telefono
    var Direccion = doc.data().Direccion
    var Forma_de_pago = doc.data().Forma_de_pago
    var Calidad = doc.data().Calidad
    var Talla = doc.data().Talla
    var Disponibilidad = doc.data().Disponibilidad
   
    // Mostrar el campo en un elemento con ID específico
    var element = document.getElementById('label_codigo');
    element.textContent = Codigo;
    var element = document.getElementById('label_nombre');
    element.textContent = Nombre;
    var element = document.getElementById('label_telefono');
    element.textContent = Telefono;
    var element = document.getElementById('label_direccion');
    element.textContent = Direccion;
    var element = document.getElementById('label_forma_de_pago');
    element.textContent = Forma_de_pago;
    var element = document.getElementById('label_calidad');
    element.textContent = Calidad;
    var element = document.getElementById('label_talla');
    element.textContent = Talla;
    var element = document.getElementById('label_disponibilidad');
    element.textContent = Disponibilidad;
  });
});

相关问题