Trying to read data from firebase and list in a table

Question

I am trying to list the data from a database in a table. When I hit the Get Data button the results are listed as undefined. I need it to list the names which can't be collect by the key as this are auto generated. Please help. I have included screenshots of the results and database.

getData.addEventListener("click", (e) => {

    $("#dataTable td").remove();

    const dbRef = ref(db, "Spinner");

    onValue(dbRef, (snapshot) => {
        snapshot.forEach((childSnapshot) => {
            const childKey = childSnapshot.key;
            const childData = childSnapshot.val();

            var row =
                "<tr><td>" +
                childData.value +
                "</td><td>";

            $(row).appendTo("#dataTable")
        });

    }, {
        onlyOnce: true,
    });
})

Answer 1

This seems wrong:

        var row =
            "<tr><td>" +
            childData.value +
            "</td><td>";

There's no property named value in your database screenshot, and you already called the val() method above to get the value out of the childSnapshot.

It should be:

        var row =
            "<tr><td>" +
            childData +
            "</td><td>";