I want to make a website that I can use to update firebase’s realtime database. But when I am testing it, it doesnt work but it works if I use another database. Ive added my code down below. Please help me asap.
<html>
<head>
<title>Firebase_form</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="wrapper">
<h1>Add Student Data to DB</h1>
<form>
<div class="input-box">
<input type="text" value="" id="studentid" placeholder = "Student ID" required>
</div>
<div class="input-box">
<input type="type" value="" id="studentName" placeholder = "Student Name" required>
</div>
<div class="input-box">
<input type="text" value = "" id="grade" placeholder = "Grade" required>
</div>
<div class="input-box">
<input type="text" value = "" id="section" placeholder = "Section" required>
</div>
<input type="submit" class = "btn "value="Submit" class="sub" id="submit">
</form>
</div>
<script type="module">
// Import the functions you need from the SDKs you need
import { initializeApp } from "https://www.gstatic.com/firebasejs/10.12.2/firebase-app.js";
import { getDatabase, ref, set, get, child } from "https://www.gstatic.com/firebasejs/10.12.2/firebase-database.js";
// TODO: Add SDKs for Firebase products that you want to use
// https://firebase.google.com/docs/web/setup#available-libraries
// Your web app's Firebase configuration
const firebaseConfig = {
apiKey: "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
authDomain: "xxxxxxxxxxxxxxxxxxxx.firebaseapp.com",
databaseURL: "https://xxxxxxxxxxxxxxxxxxx-default-rtdb.xxxx-xxxxx.firebasedatabase.app",
projectId: "xxxxxxxxxxxxxxxxxx",
storageBucket: "xxxxxxxxxxxxxxxxxx.appspot.com",
messagingSenderId: "xxxxxxxxxxxxxxxxxxxx",
appId: "x:xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"
};
// Initialize Firebase
const app = initializeApp(firebaseConfig);
const db = getDatabase(app);
document.getElementById("submit").addEventListener('click', function(e){
e.preventDefault();
set(ref(db, 'Students/' + document.getElementById("studentid").value),
{
name: document.getElementById("studentName").value,
class: document.getElementById("grade").value,
section: document.getElementById("section").value,
last_attendance_time: "2024-1-1 00:00:00",
late_attendance: 0,
total_attendance: 0,
});
alert("Login Sucessful!");
})
</script>
</body>
</html>
Tried changing the database, then it worked, but not with this one
New contributor
Prathamesh Prabhakar is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.