I am fairly new to JavaScript and this is what I came up for hiding buttons depending if an user is logged or not. The navbar ids are correct but it does nothing with it.
function hideHeaderOptions() {
let headerUploadPicture = document.getElementById("navbar-upload-picture");
let headerProfile = document.getElementById("navbar-profile");
let headerMessages = document.getElementById("navbar-messages");
let headerResults = document.getElementById("navbar-results");
let headerLogout = document.getElementById("navbar-logout");
let headerLogin = document.getElementById("navbar-login");
if (sessionManager.isLogged()) {
headerLogin.style.display = "hidden";
} else {
headerUploadPicture.style.display = "hidden";
headerProfile.style.display = "hidden";
headerMessages.style.display = "hidden";
headerLogout.style.display = "hidden";
headerResults.style.display = "hidden";
}
}
You can use none instead of hidden here:
function hideHeaderOptions() {
if (sessionManager.isLogged()) {
document.getElementById("navbar-login").style.display = "none";
} else {
document.getElementById("navbar-upload-picture").style.display = "none";
document.getElementById("navbar-profile").style.display = "none";
document.getElementById("navbar-messages").style.display = "none";
document.getElementById("navbar-logout").style.display = "none";
document.getElementById("navbar-results").style.display = "none;
}
}