Saving forms | adactio

A very clever (and well explained) method for helping users complete forms. Particularly with modern pop-up forms, I'd say at least once a month I'm part way through typing something and accidentally shift my mouse somewhere that causes the form to close, losing everything I had written 😡 Jeremy's trick of storing the current form (well, textarea, but it should be easy to expand) content in localStorage is a great enhancement that would solve those frustrations. Here's the gist (see what I need 😄):

1. Use an eventListener to track when a user starts typing into a form/textarea;
2. When that fires, set off a new eventListener to track the browser's unload event using beforeUnload (Jeremy explains why that method well);
3. If that second listener fires, save the content of the form into localStorage against a key for the page URL/slug (you can use JSON to store multiple values in one key/value pair);
4. If the form is submitted without issue or firing the eventListener, clear the localStorage key;
   
5. Now, with that setup, you can add some initial logic that checks localStorage on page load for a key that matches the current URL and, if found, parse the JSON and populate the form.

Et voila! Neat 👍