I get this error when trying to load a function from javascript module at bottom of html page.
dex.html:101 Uncaught ReferenceError: findData is not defined
at onload (index.html:101:80)
New to html and .js in general, trying to make a html/js page with a guest list:
html with text inputs at top, javascript module at bottom of body with onclick eventlisteners and functions to send text stored as var to firebase database
have a function findData which gets the firebase data and updates the h3 html tags of id Name, Phone, and Insta with the corresponding keys from that child:
function findData() {
var database = firebase.database().ref();
var peopleRef = database.child('People');
People.once("value").then(function(snapshot) {
snapshot.forEach(function(userSnapshot) {
findName.innerHTML += "Name: " + snapshot.val().Name;
findPhone.innerHTML += "Phone: " + snapshot.val().Phone;
findInsta.innerHTML += "Insta: " + snapshot.val().Insta + "<br>";
console.log(snapshot.val());
})
})
}
I want the list updated instantly when you refresh, I know there’s probably many ways you could go with having the data updated in html, for me, i thought onLoad seemed most straightforward:
causes this error:
dex.html:101 Uncaught ReferenceError: findData is not defined
at onload (index.html:101:80)
🙁
I’m using the cdn src links in the module script opening tag, and importing from those links below inside the module.
I tried using window.findData = findData; inside the module, and calling findData(); in a separate in the html at the top, didnt seem to work (if the syntax was even correct). Maybe this is too much for a noob like me, but I feel like I am so close and just need to be able to call findData() on page load.
How can I fix this issue and have findData load correctly on page refresh?