I am trying to use local storage to be able to save/load multiple sets of form inputs in a web app. I have found a couple references but I'm not sure how to apply them to my needs. Also, most examples I've found here concern storing a single set of settings which then are loaded the next time the page/app is loaded:
www.graphicpush/using-localstorage-api-as-a-light-database
www.paperkilledrock/2010/05/html5-localstorage-part-three/
The first link (graphicpush) is what I have tried to use to store multiple form input values but I'm not even sure if the values are being placed in the database. And once they are actually placed in the database, I'm not sure how to selectively recall a unique ID from the database and display it in the form.
The second link, I've looked at and is very close to what I need as well and I'm having the same problems as previously described.
My web app is located at and you can view the attempt at localstorage in the "save.js" file. I know I'm very far off so please be kind.
I feel like this should be fairly simple but I don't have a firm grasp on what I should be doing so any help would be appreciated.
I am trying to use local storage to be able to save/load multiple sets of form inputs in a web app. I have found a couple references but I'm not sure how to apply them to my needs. Also, most examples I've found here concern storing a single set of settings which then are loaded the next time the page/app is loaded:
www.graphicpush./using-localstorage-api-as-a-light-database
www.paperkilledrock./2010/05/html5-localstorage-part-three/
The first link (graphicpush) is what I have tried to use to store multiple form input values but I'm not even sure if the values are being placed in the database. And once they are actually placed in the database, I'm not sure how to selectively recall a unique ID from the database and display it in the form.
The second link, I've looked at and is very close to what I need as well and I'm having the same problems as previously described.
My web app is located at http://www.sovascreen./estimator and you can view the attempt at localstorage in the "save.js" file. I know I'm very far off so please be kind.
I feel like this should be fairly simple but I don't have a firm grasp on what I should be doing so any help would be appreciated.
Share Improve this question asked Jan 4, 2012 at 22:18 barelybenjaminbarelybenjamin 391 silver badge5 bronze badges2 Answers
Reset to default 4Local storage is remarkably simple. A primer:
// set
localStorage.setItem('blah', 'blahblah')
// check if it is set
localStorage.getItem('blah')
// check how many items are stored
localStorage.length
// another way to get the item
localStorage.key(0);
// remove the item
localStorage.removeItem('blah')
Here's a Fiddle with a tiny library I wrote for you to interact with. It allows objects or strings to be added to localstore via JSON.parse and stringify.
Hit 'run' a few times and the output should look like:
blah is not set. setting to blahblah
["blah"]
blah is set to blahblah
[]
blah is not set. setting to blahblah
["blah"]
blah is set to blahblah
[]
The page isn't loading a save.js file for me. Can you confirm that it's working as intended?
If you're using Chrome, the developer tools allow you to view the contents of localStorage. Click Resources > Local Storage. It will show you all of the key/value pairs you've stored, and you can delete them as well.