jQuery Plugin For Form State Auto Save/Restore with Html5 sessionStorage - Squirrel.js
File Size: | 17.4 KB |
---|---|
Views Total: | 5768 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
Squirrel.js is a simple yet useful jQuery plugin that automatically and temporarily stores the information from the form as you type in fields or change values, until the form is submitted.
The plugin uses HTML5 sessionStorage for the current form state in case you refresh the browser or navigate away and return.
You might also like:
- Automatically Persist Text Field Values Locally - Garlic
- jQuery Plugin to Save Form Fields Values To localStorage - phoenix
- jQuery Plugin to Restore User Previously Entered Values - Remember State
- jQuery Plugin To Autosave Form Content - autoSave
- jQuery Plugin For Auto Saving Form Values
How to use it:
1. Load the jQuery library and squirrel.js script at the end of the Html page.
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script> <script src="jquery.squirrel.min.js"></script>
2. Enable the plugin on an Html form by just adding a CSS class name of 'squirrel' to it. The plugin will do the rest.
<form action="/" method="post" class="squirrel"> </form>
3. Some default options for Squirrel.js.
clear_on_submit: true, storage_method: 'session', storage_key: 'squirrel', storage_key_prefix: ''
Change logs:
2016-01-08
- Using jQuery's trim and tidied code
2015-08-21
- v0.1.8
- Added storage_key_prefix prefix and added sanitize option strings
- Onload function in correct scope
- Trim whitespace whilst checking isString
2015-07-26
- Check if the storage_method is a string
- Using on() instead of the event aliases
- Removed converting action to lowercase
2015-07-24
- Moved section that checks if the storage property is valid
2015-07-23
- Reduced code by caching the storage property
2015-07-21
- v0.1.6
- Added $.each() loop back into select logic to allow multiple options being selected.
2014-11-20
- Added support for localStorage as a configuration option.
- Add support for all HTML5 input types - color, date, datetime, datetime-local, month, week, time, range, search, tel, and URL.
2014-11-19
- Configured to also include input type='email' fields (added a test field to index file and styled those input types as well for the demo).
2014-05-19
- Added action parameter in front of the options parameter. This will change things a little going forward, but most default configurations will still work.
- Adding comments, moving stash and unstash functions out of the loop so they're only defined once.
This awesome jQuery plugin is developed by jpederson. For more Advanced Usages, please check the demo page or visit the official website.