'How do I create a dynamic html page with javascript, depending on search value and firbase content
I might be doing this wrong but it would be great solving this with javascript. I dont have experience with any frameworks yet.
I want to create a dynamic page after searching a certain ID. There is several libaries in my firebase database, and every libary has his own books. If you search for a libary, it should open up a libary page with the correct books, included in the database.
button01.addEventListener("click", e => {
CheckLibary(input.value);
});
function CheckLibary(i) {
firebase.database().ref('libary/').on('value', function (snapshot) {
if ( snapshot.val()[i]) {
CreateLibary();
} else {
console.log("LIBARY ID DOES NOT EXIST!");
}
});
}
function CreateLibary() {
var opened = window.open("");
opened.document.write(`
<html>
<head>
</head>
<body>
<script>
window.onload = FillBooks();
</script>
</body>
</html>
`);
}
So far I am using window.open / document.write to create a new page. But how do I fill that Page with the right Firebase content?
I managed to trigger a function when loading that page, with the script tag down below,to use javascript to fill content into the dom. But I feel like this is the wrong way to do such task. I don't have much experience, that is just what I came up with so far, also thinking further, I seem to run into many issues this way, specially when several pages are created.
Hope to find some help. Thank you
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|