Firebase example:
Users:
User1
A
123
234
345
B
C
Above is the firebase data.
I wanted to call all the data under User1, A. Which means "123", "234", "345" should be the output for my table. I also wanted to display them to be displayed in a table I have in my html file using javascript. Can anyone advise? I am new to firebase and am confused with the other guides online.
Should I create a table using javascript or keep my table at html file?
Thank you for advise and help.
For Real Time Database try this:
firebase.database().ref('/User1/A').once('value').then(function(snapshot) {
let items = snapshot.val();
items.forEach( (v) => writeData(v) );
});
const writeData = (value) => {
let el = document.querySelector('p');
el.innerHTML = value;
document.appendChild(el);
}
By doing the following, in JavaScript you will get all the children of the User1/A node:
var ref = firebase.database().ref('User1/A');
ref.once('value', function(snapshot) {
snapshot.forEach(function(childSnapshot) {
var childKey = childSnapshot.key;
console.log(childKey);
var childData = childSnapshot.val();
console.log(childData);
//....
});
});
From there you can populate your HTML table
Related
I have nested firebase data and in this data I have auto generated ids but I need to take child node's data of this auto generated ids and I have to use these ids in my query. I need to take ordersTerminal/kullanicilarTerminal/userIds(auto generated)/orderIds(auto generated)/isim/username I need to follow that path actually but I can't figure out. How can I make? Here my firebase database:
And here my javascript code:
function userConfig() {
var dataRef = firebase.database().ref('ordersTerminal').child("kullanicilarTerminal");
dataRef.on('value', function(snapshot) {
snapshot.forEach(function(childSnapshot) {
var childData = childSnapshot.val();
console.log(childData);
});
});
}
To get the userId of the currently logged in user, you can do the following:
let user = firebase.auth().currentUser;
let uid = user.uid;
To get the autogenerated id, you can do the following:
dataRef.on('value', function(snapshot) {
snapshot.forEach(function(childSnapshot) {
var childData = childSnapshot.val();
var key = childSnapshot.key;
console.log(childData);
});
});
Your reference is at node kullanicilarTerminal, if you use the property key inside the forEach, you will get the following id 93ybLDezrCW2pJsDkZbH6IJfq03
If 93ybLDezrCW2pJsDkZbH6IJfq03 is the id of the currently logged in user, then you can do the following:
dataRef.child(uid).on('value', function(snapshot) {
snapshot.forEach(function(childSnapshot) {
var childData = childSnapshot.val();
var key = childSnapshot.key;
console.log(childData);
});
});
Now childSnapshot.key will return 01032020-05032020-2
If you dont have both ids, then you can get the data by doing the following:
dataRef.on('value', function(snapshot) {
snapshot.forEach(function(childSnapshot) {
childSnapshot.forEach(function(orderSnapshot) {
console.log(orderSnapshot.key); //01032020-05032020-2
console.log(orderSnapshot.val());
})
})
});
});
Your reference is at node kullanicilarTerminal, if you use the property key inside the first forEach, you will get the following id 93ybLDezrCW2pJsDkZbH6IJfq03, then you do another for loop and retrieve the second id 01032020-05032020-2 and the details using val().
I am working on this google auth chat website everything has goon really smooth everything is basically done but the last thing that is to get the messages from a json database i can send messages to the json database but i cant get the array from the object here is my code:
index.js:
socket.on('load', () => {
for (let i in data) {
socket.emit('add message', data[i]);
}
});
main.js(html file):
socket.emit('load');
socket.on('add message', (text) => {
let list = document.getElementById('list');
let li = document.createElement('li');
li.textContent = text;
list.appendChild(li)
});
A traditional json response from the node json DB is as follows:
data = {
test: {
data1 : {
messages : ['test','array']
},
data2 : 5
}
}
From here, getting that messages array is simply to do this:
data.test.data1.messages
Example:
I have Firebase database managing following structure.
-DATA
-New
-CONTENTS
-animals_animal1: 1
-foods_food10: 4
-foods_food6: 5
-girls_girl1: 2
-girls_girl5: 3
I want to get children's value by using orderByValue() as 1,2,3,4,5 manner using snaps.forEach in JavaScript. My code as follows.
exports.handleAddNewContentAndAddToNewEvent = functions.database.ref('/CONTENT_MANAGEMENT/DATA/CONTENTS/{contentId}')
.onWrite(event => {
// Only edit data when it is first created.
if (event.data.previous.exists()) {
return;
}
// Exit when the data is deleted.
if (!event.data.exists()) {
return;
}
var newContentsRef = event.data.ref.parent.parent.child('PACKS/New/CONTENTS');
return Promise.all([
newContentsRef.orderByValue().once('value')
]).then(function(snaps) {
snaps.forEach(function(childSnapshot) {
var childKey = childSnapshot.key;
var childData = childSnapshot.val();
console.log('loaded', childKey);
// ...
});
});
});
However, I failed to get intended solution. How to get solution what I need?
Structure
I need to save data to the database but at a certain index. I tried pulling the data down with
var people = [];
ref.once('value', function(snapshot) {
snapshot.forEach(function(childSnapshot) {
var ID = childSnapshot.key;
childSnapshot.forEach(function(lastSnapshot) {
var qr = lastSnapshot.val();
people.push({[ID]: qr});
return true;
});
});
My firebase structure:
people: {
jake: "231",
jessica: "412",
rachel: "112"
}
Then I splice the list and add someone at a certain index:
index = 1; // add person after jessica
people.splice(index, 0, person);
I want to sync this back up to Firebase but set and update don't allow a format like this.
How can I do this? Thanks!
I am reading a lot of different data from my firebase database, currently, I have hard coded it. This works fine, however I have soo many lines of code that now when I want to alter my code it gets really confusing. Below I have pasted the current apporach I have taken.
var ref = new Firebase("URL");
// Data set 1
ref.on('child_added', function(snapshot) {
var snapshot = snapshot.val();
textbox1.innerHTML = snapshot.getvalue1.age;
});
ref.on('child_changed', function(snapshot) {
var snapshot = snapshot.val();
textbox1.innerHTML = snapshot.getvalue1.age;
});
// Data set 2
ref.on('child_added', function(snapshot) {
var snapshot = snapshot.val();
textbox2.innerHTML = snapshot.getvalue2.age;
});
ref.on('child_changed', function(snapshot) {
var snapshot = snapshot.val();
textbox2.innerHTML = snapshot.getvalue2.age;
});
.....
.....
.....
// Data set 100
ref.on('child_added', function(snapshot) {
var snapshot = snapshot.val();
textbox100.innerHTML = snapshot.getvalue100.age;
});
ref.on('child_changed', function(snapshot) {
var snapshot = snapshot.val();
textbox100.innerHTML = snapshot.getvalue100.age;
});
Instead of the approach I have taken, is it possible to use a for loop or something like that to loop through each data because my structure for each textbox / keyword in firebase is more or less the same.
I am fairly new to javascript but from my knowledge of java, I believe it would be started of something like this;
var myTextbox = document.getElementById("mytextbox");
for (var i = 0; i < myTextbox.length; i++) {
}
Any help is welcomed, if my question is not clear please let me know.
EDITED:
Mydata:
textbox1 - value - age : "This is textbox 1, age:21"
textbox2 - value - age : "This is textbox 2, age:53"
textbox2 - value - age : "This is textbox 3, age:04"
....
....
I am not an expert on firebase but here are some potential solutions you can try. For example, instead of writing a child_added and child_changed, you can use 'value'. (Reference)
ref.on('value', function(snapshot) {
var snapshot = snapshot.val();
textbox1.innerHTML = snapshot.getvalue1.age;
});
But this is not a good solution for your problem as you want all the values retrieved at once.
It seems your snapshot has all the values with attributes'getValuei' where i is from 1...n.
A better solution could be something like this..
ref.on('value', function(snapshot) {
var snapshot = snapshot.val();
textbox1.innerHTML = snapshot.getvalue1.age;
textbox2.innerHTML = snapshot.getvalue2.age;
textbox3.innerHTML = snapshot.getvalue3.age; //..and so on..
});