Reputation: 67
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
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
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