Auto-save browser forms with localstorage

We all know how annoying it is to be half-way through filling in a web form, only to accidentally close the window or hit the back button. Well, with the advent of localStorage, the solution is quite simple: just get the browser to do it!


A jQuery plugin, called sisyphus, has been in development by Alexander Kaupanin since October 2011; he has been making many minor fixes and improvements along the way. To use it, download the plugin itself to your own web space: sisyphus.min.js and include these lines in your <head> section:

<script src="http://code.jquery.com/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" src="sisyphus.min.js"></script>
<script type="text/javascript">
$(function(){
	$('form').sisyphus({timeout: 5});
});
</script>

You'll need to modify the src attribute of sisyphus.min.js, depending on where you put it.

The example above saves all forms on the page every 5 seconds. There are several simple customisations - see http://simsalabim.github.com/sisyphus/ for more options.


Comments

It's quiet in here...Add your comment

Related Reading

Web Development Survey!
Which web technologies would you like to see the back of, and why?