Sometimes it’s very desired for web application, to have a possibility of saving the forms state, that can be pre-loaded later, after refresh, etc.
Save form data to local storage with jQuery plugins
Here we have a two plugins, whose job is to save form data to local storage.
1. Phoenix – is user-friendly jQuery form plugin, that gets HTML5 Web Storage API to cooperate in an easy way, to reach desired effects with a couple lines of code. It puts form fields values to the storage. We can keep the items safely, using prefixes for particular pages or forms.
Phoenix is a stable jQuery plugin that saves data entered inside form fields locally and restores it in case the browser crashes or the page is refreshed accidentally.
1. We need to include jQuery and jquery.phoenix plugin
2. Let’s create our HTML form
3. Now we can start the magic:
To clear storage on successful form submission, just run the:
We can apply the plugin for the inputs, particular or all the forms of the web app. We can also select inputs by the class.