Collectives™ on Stack Overflow

Find centralized, trusted content and collaborate around the technologies you use most.

Teams

Q&A for work

Connect and share knowledge within a single location that is structured and easy to search.

i'm creating a js only log in form and i want the browser to hold a variable value in its session data. it seems to work but then i cannot clear it when clicking logout button,

here is my code:

var isAuthorised = window.sessionStorage.key("authorised");
var available_user_name = Array("user1", "user2", "user3"),
   available_user_pass = Array("1001", "2002", "3003"),
   UAP = $("#userNameAndPassword");
for (var i = 0; i < available_user_name.length; i++) {
   var user_names = available_user_name[i];
   var user_passws = available_user_pass[i];
   $("#available_accounts").append("<div><div>" + user_names + "</div><div>" + 
 user_passws + "</div></div>");
$("#btn").click(function () {
   var user_name = document.getElementById("email").value;
   user_pass = document.getElementById("pwd1").value;
   btn = $("#btn"),
      result = $("#result");
if ($.inArray(user_name, available_user_name) >= 0) {
  if (available_user_name.indexOf(user_name) == 
  available_user_pass.indexOf(user_pass)) {
     result.html("Welcome back : " + user_name);
     result.css({
        "color": "SeaGreen"
     window.sessionStorage.setItem('authorised', 'true');
  } else {
     result.html("You've selected wrong password for username, please try again");
     result.css({
        "color": "crimson"
  } else {
     result.html("This name doesn't registred with us");
      result.css({
         "color": "crimson"
     $(".login-wrapper").delay(500).fadeOut(500);
     $(".login-wrapper").removeClass("flex");
     $(".secure-content-wrapper").delay(500).fadeIn(500);
     // console.log("authorised")
  } else {
     // alert('Login details incorrect');
     $(".login-wrapper").fadeIn(500);
     $(".login-wrapper").addClass("flex");
     $(".secure-content-wrapper").fadeOut(500);
     // console.log("not authorised")
 , 200);
$(".logout").click(function (e) {
    sessionStorage.setItem('authorised', 'false');
   sessionStorage.removeItem('authorised');
   console.log(isAuthorised)
the var is "isAuthorised" and is getting the value i set as a key about line  19 "window.sessionStorage.setItem("authorised", "true");"
id rather it just be "var authorised = false"
and then later call "sessionStorage[authorised] = true;" this to me is cleaner, but i can't figure how to clear this on clicking logout either. any help would be greatly appreciated
                replace var isAuthorised = window.sessionStorage.key("authorised"); with var isAuthorised = window.sessionStorage.getItem("authorised");
– Anil kumar
                Feb 20 at 12:09
                if logout function, add this line isAuthorised=window.sessionStorage.getItem("authorised");
– Anil kumar
                Feb 20 at 12:11
Here you have a useless set.
$(".logout").click(function (e) {
   sessionStorage.setItem('authorised', 'false');  // <==== this is useless
   sessionStorage.removeItem('authorised');
   console.log(isAuthorised)
Then you never checked the new value, change this function
//var isAuthorised = window.sessionStorage.key("authorised"); <=== remove this line, this is a constant
setInterval(function check() {
  if ( window.sessionStorage.getItem("authorised") ) { //You must check, not use a constant variable
     $(".login-wrapper").delay(500).fadeOut(500);
     $(".login-wrapper").removeClass("flex");
     $(".secure-content-wrapper").delay(500).fadeIn(500);
     // console.log("authorised")
  } else {
     // alert('Login details incorrect');
     $(".login-wrapper").fadeIn(500);
     $(".login-wrapper").addClass("flex");
     $(".secure-content-wrapper").fadeOut(500);
     // console.log("not authorised")
 , 200);
        
Thanks for contributing an answer to Stack Overflow!
Please be sure to answer the question. Provide details and share your research!
But avoid …
Asking for help, clarification, or responding to other answers.
Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.