Skip to content

Instantly share code, notes, and snippets.

@codepo8
Created August 25, 2010 14:44
  • Star 11 You must be signed in to star a gist
  • Fork 5 You must be signed in to fork a gist
Star You must be signed in to star a gist
Save codepo8/549634 to your computer and use it in GitHub Desktop.
Store the state of a rendered form the easy way
<script>
// test for localStorage support
if(('localStorage' in window) && window['localStorage'] !== null){
var f = document.getElementById('mainform');
// test with PHP if the form was sent (the submit button has the name "sent")
<?php if(isset($_POST['sent']))){?>
// get the HTML of the form and cache it in the property "state"
localStorage.setItem('state',f.innerHTML);
// if the form hasn't been sent...
<?php }else{ ?>
// check if a state property exists and write back the HTML cache
if('state' in localStorage){
f.innerHTML = localStorage.getItem('state');
}
<?php } ?>
}
</script>
@fearphage
Copy link

I like the idea.

I'd put something in front of localStorage so it won't throw when it's undefined.

if (this.localStorage || 'localStorage' in this)

I think firefox requires the latter or it will freeze or crash in some versions.

Copy link

ghost commented Aug 27, 2010

Great idea! I recently wrote a front end app that caches the results of multiple calculations as an HTML fragment for summation purposes. Storing the inputs and results locally for future retrieval is a great feature add. I wonder if, in that scenario, we should be advising users that the results are cached from their last visit and give them an opportunity to reset.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment