Auto-Save your content when editing in HTML Form Using savy.js Plugin

Hello Friends Today I am going to share one more jquery plugin to Auto-Save your content when editing in HTML Form Using savy.js Plugin. It is helpful when user filling any big form it’s automatically save your form value in localstorage So that if user accidentally refresh page then no value will be destroy but you can destroy these values at any time from local storage manually.

Integrate Auto-Save Form Feature in Your Website

You only need to call plugin’s function on page with jquery and follow below example.

Libraries

Include savy.js with latest jquery plugin.

<script  src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="   crossorigin="anonymous">script>
<script src="savy.min.js">script>

HTML

Created sample html form which values need to auto-save while filling.

JS

Call the plugin’s function on page to activate auto-save feature.

$(function() {  
 $('.auto-save').savy('load');
});

Destroy form value from local storage by clicking on button.

$(function() {  
 $( ".destroy" ).click(function() {
    $('.auto-save').savy('destroy');
  });
});

See live demo and download source code.

See official github repository for more information and follow for future updates. Don’t forget to read license for using above plugin in your commercial project.

Related