Display a Key from Firebase Database

David Knight — Tue, 16 Aug 2022 22:56:43 +0000

Hello, I have a function where I am trying to display the user type when they're logged in. I currently have user name displaying but I'm not sure how to change my function to display the user's profile type. This is the error code I'm receiving and I have provided my code and a detailed screenshot of what I am trying to accomplish:

This is the error I'm getting:

Uncaught Error: child failed: path argument was an invalid path = "/Studiopick/studios[object HTMLParagraphElement]". Paths must be non-empty strings and can't contain ".", "#", "$", "[", or "]"
at na (validation.ts:374:11)
at ra (validation.ts:395:3)
at os (Reference_impl.ts:543:5)
at rs (Reference_impl.ts:483:31)
at Su.ref (Database.ts:102:24)
at getUserType (editprofile.js:74:25)
at editprofile.js:88:1
This is my javascript code:

// Initialize Firebase
firebase.initializeApp(firebaseConfig);

//Creating sets in database
firebase.database().ref("/Studiopick/studios").child("users").update({

});

//Save information
function save(){
studioName = document.getElementById("studioName").value;
email = document.getElementById("email").value;
firstName = document.getElementById("firstName").value;
lastName = document.getElementById("lastName").value;
address = document.getElementById("address").value;
country = document.getElementById("country").value;
state = document.getElementById("state").value;
city = document.getElementById("city").value;
zip = document.getElementById("zip").value;
phoneNumber = document.getElementById("phoneNumber").value;
firebase.database().ref("/Studiopick/studios/users").child(studioName).update({

firstName : firstName,
lastName : lastName,
email : email,
address : address,
country : country,
state : state,
city : city,
zip : zip,
phoneNumber : phoneNumber,
});

}

//Get Information
function getData(){
studioName = document.getElementById("studioName").value;
firebase.database().ref("/Studiopick/studios/users/" + studioName).on('value', function(snapshot){
snapshot.forEach(function(getProfile){
studioData = getProfile.val();
studio = getProfile.key;

       var email = studioData["email"];



       console.log("studio name: " + studio, "email: " + email);
       currentUser = "<h3><strong>"+ studio + "</strong></h3>";
       document.getElementById("profile-name").innerHTML = currentUser;
    });
});

}
getData();

//Get User Type
function getUserType(){
profileType = document.getElementById("userType");
firebase.database().ref("/Studiopick/studios" + profileType).on('value', function(snapshot){
snapshot.forEach(function(getUserType){
typeData = getUserType.val();
type = getUserType.key;

       console.log("profile type: " + type);
       spAccType = "<p>"+ type + "</p>";
       document.getElementById("userType").innerHTML = spAccType;
    });
});

}
getUserType();
What I'm trying to display from firebase:

What I'm trying to achieve:

DEV Community: David Knight

Display a Key from Firebase Database