Alistair Norris
Alistair Norris

Reputation: 67

Can't set value with local storage

I'm having an issue with local storage. My debugger shows me that its storing it locally correctly but for some reason I can't seem to set the value of feed1MainHeader with the stored content? Any ideas?

    <div class="search">


    <input type="text" name="username" id="mySearch" value="">
    <input type="button" class="myButton" value="" onclick="setHeader();">


    </div>

Heres my value I'm trying to chage with the above search

    <div id="feed1MainHeader" value=""></div>

Heres the javascript functions I'm writing for it.

    <script type="text/javascript">                       


    function setHeader(){

    var header1 = document.getElementById("mySearch");
    localStorage.setItem("header", header1.value);

    }

    function loadHeaders(){


    document.getElementById('feed1MainHeader').value = localStorage.getItem("header");

    }

    loadHeaders();
     </script>

Any advice would be amazing.

Upvotes: 0

Views: 2228

Answers (2)

adeneo
adeneo

Reputation: 318182

DIV elements doesn't have a value, you have to use textContent, innerHTML etc to set the content of the DIV

function setHeader() {
    var header1 = document.getElementById("mySearch");
    localStorage.setItem("header", header1.value);
}

function loadHeaders() {
    document.getElementById('feed1MainHeader').innerHTML = localStorage.getItem("header");
}

loadHeaders();

Upvotes: 1

WearFox
WearFox

Reputation: 293

maybe is because you are calling a function before all the document had made, you must use window.onload

<script type="text/javascript">                       


    function setHeader(){

    var header1 = document.getElementById("mySearch");
    localStorage.setItem("header", header1.value);

    }

    function loadHeaders(){


    Document.getElementById('feed1MainHeader').value = localStorage.getItem("header");

    }

    window.onload = function(){ loadHeaders() };
     </script>

Upvotes: 1

Related Questions