So this is like a ToDo list site, but when I refresh nothing is saved!
Here are the HTML and Javascript:

localStorage.setItem('myInput'); {
  var save = localStorage.getItem("myInput");
}
localStorage.setItem('myInput2'); {
  var save = localStorage.getItem("myInput2");
}
localStorage.setItem('myInput3'); {
  var save = localStorage.getItem("myInput3");
}

<div class="modal-content">
  <span class="close">&times;</span>
  <div id="myDIV" class="header">
    <h2>Add a task</h2>
    <input type="text" id="myInput" placeholder="Write a task...">
    <input type="text" id="myInput2" placeholder="Estimated time...">
    <input type="text" id="myInput3" placeholder="Week...">
    <span onclick="newElement()" class="addBtn" value="save" onClick="save()">Add</span>
  </div>
</div>
</div>


<ul id="tehtavat">
</ul>

So this is like a ToDo list site, but when I refresh nothing is saved!
Here are the HTML and Javascript:

localStorage.setItem('myInput'); {
  var save = localStorage.getItem("myInput");
}
localStorage.setItem('myInput2'); {
  var save = localStorage.getItem("myInput2");
}
localStorage.setItem('myInput3'); {
  var save = localStorage.getItem("myInput3");
}

<div class="modal-content">
  <span class="close">&times;</span>
  <div id="myDIV" class="header">
    <h2>Add a task</h2>
    <input type="text" id="myInput" placeholder="Write a task...">
    <input type="text" id="myInput2" placeholder="Estimated time...">
    <input type="text" id="myInput3" placeholder="Week...">
    <span onclick="newElement()" class="addBtn" value="save" onClick="save()">Add</span>
  </div>
</div>
</div>


<ul id="tehtavat">
</ul>

I also get this error in the console:

index.html Uncaught TypeError: Failed to execute 'setItem' on 'Storage': 2 arguments required, but only 1 present.

• javascript
• jquery
• html
• local-storage

Share Improve this question Follow edited Mar 5, 2018 at 10:57 Vadim Kotov 8,28488 gold badges5050 silver badges6363 bronze badges asked Dec 5, 2017 at 19:45 JokamuttaJokamutta 111 gold badge11 silver badge77 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 5

When you want to save value to localstorage you need to pass a value as second attribute. First one is the key.

localStorage.setItem('myInput', myValue);

Think of localstorage as list of key / value pairs.

Besides, you want to write data to localstorage manually each time your data changes, so let's say on keyup event:

document.getElementById('myInput').addEventListener('keyup', function(event){
    localStorage.setItem('inputValue', event.target.value);
})

And i can imagine that on load, you want to bring this value back;

var inputValue = localStorage.getItem('inputValue');

if(inputValue) {  //just check if there's value saved
    document.getElementById('myInput').value = inputValue;
}

Please take into consideration that i typed code out of my head without testing it, so there are some typos possible. You can as well maybe try to solve typos on your own.

Want to store string? Store like this:

• localStorage.setItem("myInput", "valueFromInput")

Get like this:

• localStorage.getItem("myInput")

Want to store array or object? Store like this :

• Note : localStorage can only store strings so we need convert array into a string before storing. Convert looks like this :

   var data = JSON.stringify('{myData: "myData"}');
   localStorage.setItem("myInput", data)
  

Get data like this:

• var data = JSON.parse(localStorage.getItem("myInput"))