hi im trying to make a login page that after you push the button it goes to the index. I did that but now i want to change part of the html to say welcome back ( and the name of the username)
i’ve wrote this so far but i dont know how to save the username so i can use it again in the next page.
this is the html:
<form id="login-form">
<!--Error Message-->
<div id="login-error-msg-holder">
<p id="login-error-msg">Invalid username <span id="error-msg-second-line">and/or password</span></p>
</div>
<!--Form-->
<div class="form-floating">
<input type="name" class="form-control name " name="name" id="floatingInput" id="name-field" placeholder="user123">
<label for="floatingInput">Username</label>
</div>
<div class="form-floating">
<input type="password" id="password-field" class="form-control" id="floatingPassword" name="password" placeholder="Password">
<label for="floatingPassword">Password</label>
</div>
<div class="form-check text-start my-3">
<input class="form-check-input" type="checkbox" value="remember-me" id="flexCheckDefault">
<label class="form-check-label" for="flexCheckDefault">
Remember me
</label>
</div>
<button class="btn w-100 py-2" id="login-form-submit" value="Login" type="submit">Sign in</button>
<p class="mt-5 mb-3 text-body-secondary">© 2017–2024</p>
</form>
</main>
And this is the js:
window.onload=loginButton.addEventListener("click",(e) => {
e.preventDefault();
const name = loginForm.name.value;
const password = loginForm.password.value;
if (name === "user123" && password === "1") {
window.location.href = 'index.html';
} else {
loginErrorMsg.style.opacity = 1;
}
})
function message(){
if (window.history='Login.html' ) {
document.getElementById('navlogin').innerHTML='Welcome back'+ name + '!';
}
else{
document.getElementById('navlogin').innerHTML='';
}
}
i tried using the console.log but i cant save it for a little time so i can use it later.
any ideas?