Please take a look at the below mentioned code and help me figure out the problem. I am trying to get data from my firestore database and display it here.
<code> <!DOCTYPE html>
<html>
<head>
<title>Admin Dashboard</title>
<script src="https://www.gstatic.com/firebasejs/9.0.2/firebase-app-compat.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.0.2/firebase-firestore-compat.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.0.2/firebase-auth-compat.js"></script>
</head>
<body>
<h1>Salesperson Activity Tracking</h1>
<div id="data"></div>
<script>
// Your web app's Firebase configuration
const firebaseConfig = {
apiKey: "MYAPIKEY",
authDomain: "MYAUTHDOMAIN",
projectId: "MYPROJECTID",
storageBucket: "MYSTORAGEBUCKET",
messagingSenderId: "MYSENDERID",
appId: "MYAPPID"
};
console.log("Firebase Config:", firebaseConfig);
// Initialize Firebase
const app = firebase.initializeApp(firebaseConfig);
const db = firebase.firestore();
console.log("Firebase app initialized:", app);
// Function to fetch and display data
function fetchData() {
console.log("Fetching data...");
db.collection("locations").get().then((querySnapshot) => {
if (querySnapshot.empty) {
console.log("No documents found in 'locations' collection.");
document.getElementById('data').innerHTML = '<p>No data found</p>';
return;
}
console.log("Documents found in 'locations' collection: ", querySnapshot.size);
querySnapshot.forEach((doc) => {
const userId = doc.id;
console.log(`Fetching subcollection 'dailyLocations' for userId: ${userId}`);
doc.ref.collection("dailyLocations").get().then((subQuerySnapshot) => {
if (subQuerySnapshot.empty) {
console.log(`No documents found in 'dailyLocations' subcollection for userId: ${userId}`);
document.getElementById('data').innerHTML += `<p>No location data for user: ${userId}</p>`;
} else {
console.log(`Documents found in 'dailyLocations' for userId: ${userId}: `, subQuerySnapshot.size);
subQuerySnapshot.forEach((subDoc) => {
const data = subDoc.data();
const date = new Date(data.timestamp);
const dateString = `${date.toLocaleDateString()} ${date.toLocaleTimeString()}`;
document.getElementById('data').innerHTML += `<p>User: ${userId}, Latitude: ${data.latitude}, Longitude: ${data.longitude}, Timestamp: ${dateString}</p>`;
});
}
}).catch((error) => {
console.error("Error fetching subcollection: ", error);
document.getElementById('data').innerHTML += `<p>Error fetching location data for user: ${userId}</p>`;
});
});
}).catch((error) => {
console.error("Error fetching main collection: ", error);
document.getElementById('data').innerHTML = '<p>Error fetching data</p>';
});
}
fetchData();
</script>
</body>
</html>
</code>
<code> <!DOCTYPE html>
<html>
<head>
<title>Admin Dashboard</title>
<script src="https://www.gstatic.com/firebasejs/9.0.2/firebase-app-compat.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.0.2/firebase-firestore-compat.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.0.2/firebase-auth-compat.js"></script>
</head>
<body>
<h1>Salesperson Activity Tracking</h1>
<div id="data"></div>
<script>
// Your web app's Firebase configuration
const firebaseConfig = {
apiKey: "MYAPIKEY",
authDomain: "MYAUTHDOMAIN",
projectId: "MYPROJECTID",
storageBucket: "MYSTORAGEBUCKET",
messagingSenderId: "MYSENDERID",
appId: "MYAPPID"
};
console.log("Firebase Config:", firebaseConfig);
// Initialize Firebase
const app = firebase.initializeApp(firebaseConfig);
const db = firebase.firestore();
console.log("Firebase app initialized:", app);
// Function to fetch and display data
function fetchData() {
console.log("Fetching data...");
db.collection("locations").get().then((querySnapshot) => {
if (querySnapshot.empty) {
console.log("No documents found in 'locations' collection.");
document.getElementById('data').innerHTML = '<p>No data found</p>';
return;
}
console.log("Documents found in 'locations' collection: ", querySnapshot.size);
querySnapshot.forEach((doc) => {
const userId = doc.id;
console.log(`Fetching subcollection 'dailyLocations' for userId: ${userId}`);
doc.ref.collection("dailyLocations").get().then((subQuerySnapshot) => {
if (subQuerySnapshot.empty) {
console.log(`No documents found in 'dailyLocations' subcollection for userId: ${userId}`);
document.getElementById('data').innerHTML += `<p>No location data for user: ${userId}</p>`;
} else {
console.log(`Documents found in 'dailyLocations' for userId: ${userId}: `, subQuerySnapshot.size);
subQuerySnapshot.forEach((subDoc) => {
const data = subDoc.data();
const date = new Date(data.timestamp);
const dateString = `${date.toLocaleDateString()} ${date.toLocaleTimeString()}`;
document.getElementById('data').innerHTML += `<p>User: ${userId}, Latitude: ${data.latitude}, Longitude: ${data.longitude}, Timestamp: ${dateString}</p>`;
});
}
}).catch((error) => {
console.error("Error fetching subcollection: ", error);
document.getElementById('data').innerHTML += `<p>Error fetching location data for user: ${userId}</p>`;
});
});
}).catch((error) => {
console.error("Error fetching main collection: ", error);
document.getElementById('data').innerHTML = '<p>Error fetching data</p>';
});
}
fetchData();
</script>
</body>
</html>
</code>
<!DOCTYPE html>
<html>
<head>
<title>Admin Dashboard</title>
<script src="https://www.gstatic.com/firebasejs/9.0.2/firebase-app-compat.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.0.2/firebase-firestore-compat.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.0.2/firebase-auth-compat.js"></script>
</head>
<body>
<h1>Salesperson Activity Tracking</h1>
<div id="data"></div>
<script>
// Your web app's Firebase configuration
const firebaseConfig = {
apiKey: "MYAPIKEY",
authDomain: "MYAUTHDOMAIN",
projectId: "MYPROJECTID",
storageBucket: "MYSTORAGEBUCKET",
messagingSenderId: "MYSENDERID",
appId: "MYAPPID"
};
console.log("Firebase Config:", firebaseConfig);
// Initialize Firebase
const app = firebase.initializeApp(firebaseConfig);
const db = firebase.firestore();
console.log("Firebase app initialized:", app);
// Function to fetch and display data
function fetchData() {
console.log("Fetching data...");
db.collection("locations").get().then((querySnapshot) => {
if (querySnapshot.empty) {
console.log("No documents found in 'locations' collection.");
document.getElementById('data').innerHTML = '<p>No data found</p>';
return;
}
console.log("Documents found in 'locations' collection: ", querySnapshot.size);
querySnapshot.forEach((doc) => {
const userId = doc.id;
console.log(`Fetching subcollection 'dailyLocations' for userId: ${userId}`);
doc.ref.collection("dailyLocations").get().then((subQuerySnapshot) => {
if (subQuerySnapshot.empty) {
console.log(`No documents found in 'dailyLocations' subcollection for userId: ${userId}`);
document.getElementById('data').innerHTML += `<p>No location data for user: ${userId}</p>`;
} else {
console.log(`Documents found in 'dailyLocations' for userId: ${userId}: `, subQuerySnapshot.size);
subQuerySnapshot.forEach((subDoc) => {
const data = subDoc.data();
const date = new Date(data.timestamp);
const dateString = `${date.toLocaleDateString()} ${date.toLocaleTimeString()}`;
document.getElementById('data').innerHTML += `<p>User: ${userId}, Latitude: ${data.latitude}, Longitude: ${data.longitude}, Timestamp: ${dateString}</p>`;
});
}
}).catch((error) => {
console.error("Error fetching subcollection: ", error);
document.getElementById('data').innerHTML += `<p>Error fetching location data for user: ${userId}</p>`;
});
});
}).catch((error) => {
console.error("Error fetching main collection: ", error);
document.getElementById('data').innerHTML = '<p>Error fetching data</p>';
});
}
fetchData();
</script>
</body>
</html>
I am passing all the required parameters properly still getting no data. I can see the data in the firestore database
when I run the code all i see in the developer console is Fetching data…
test.html:38 No documents found in ‘locations’ collection.`
New contributor
bipladverts is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.