CODEWITHSUNDEEP
javascripthtml
Bryson Noble
Bryson Noble

Reputation: 351

My script isn't executing properly on page load

My script is supposed to be called when the page loads, but something inside of the if statement is not working properly.

I know the script is being called because onload, the alert works. I do not know what is acting up inside the if statement.

    function nameCheck() {
        alert("test");
            if(localstorage.getItem("name" === "undefined") || localstorage.getItem("name" === null)) {
                var name = prompt("Please enter your name");
                localStorage.setItem("name", name);
                location.reload();
            }
            else {
                document.getElementById("welcome") = "Hello, " + localStorage.getItem("name");
            }
        }
<body onload="nameCheck()">
<h1 id="welcome"></h1>

I want the code to check if your name is in localstorage, and if it is, get the element with the id "welcome" and say "Hello, [name]." If it is not in localstorage, I want it to prompt for your name, save it, and reload.

The element with the id "welcome" is staying blank, even when the page reloads.

Upvotes: 1

Views: 76

Answers (4)

Sarah
Sarah

Reputation: 2003

As well as what @Gendarme said above (about innerHTML) you are also checking the localStorage values in the wrong way.

For example, you are checking if the "name" variable is null as follows:

localStorage.getItem("name" === null)

However it should be like this:

localStorage.getItem("name") === null

Also the word/term "localStorage" in your code (in the first if statement) has a small "s" and it should be a capital "S".

So the full code should be as follows:

 function nameCheck() {
    alert("test");
    if(localStorage.getItem("name") === undefined || localStorage.getItem("name") === null) {
        var name = prompt("Please enter your name");
        localStorage.setItem("name", name);
        location.reload();
    } else {
        document.getElementById("welcome").innerHTML = "Hello, " + localStorage.getItem("name");
    }
  }

Upvotes: 2

Mak Sr
Mak Sr

Reputation: 303

Instead of this if(localstorage.getItem("name" === "undefined") || localstorage.getItem("name" === null)) , write the code as :

if(localStorage.getItem("name") == "undefined" || localStorage.getItem("name") == null)

Since your format of code was wrong in first place its expected not to work. To get key pair value from localStorage you should write it as localStorage.getItem(key).Now, localStorage only supports strings as values, so be careful in using comparison sign as u know localStorage.getItem(name) === null will not work so use localStorage.getItem(name) == null instead.

Upvotes: 0

Gabriel George
Gabriel George

Reputation: 124

Also a slight improvement to @Sarah code above, you don't need to validate if it's undefined or null separately.

You can use:

if(!localStorage.getItem("name"))

Good find by Sarah about the capital S of the localStorage

So, your code should be like:

 function nameCheck() {
    alert("test");
    if(!localStorage.getItem("name")) {
        var name = prompt("Please enter your name");
        localStorage.setItem("name", name);
        location.reload();
    } else {
        document.getElementById("welcome").innerHTML = "Hello, " + localStorage.getItem("name");
    }
  }

Upvotes: 1

RaminS
RaminS

Reputation: 2239

You need to change the innerHTML of the element.

document.getElementById("welcome").innerHTML = "Hello, " + localStorage.getItem("name");

Upvotes: 3

Related Questions