Save Form Changes In Local Storage – form-storage

Category: Form , Javascript , Recommended | January 14, 2019
Author: appleple
Views Total: 593
Official Page: Go to website
Last Update: January 14, 2019
License: MIT

Preview:

Save Form Changes In Local Storage – form-storage

Description:

form-storage is a small JavaScript library to store the current values of your form fields in the local storage to prevent data loss.

The saved values will be automatically restored any time when needed such as refresh, next visit, etc.

See also:

How to use it:

Install the form-storage via package managers:

# Yarn
$ yarn add form-storage

# NPM
$ npm install form-storage --save

Import the library as a module.

// ES 6
import FormStorage from 'form-storage';

Or directly include the JavaScript file ‘form-storage.js’ on the webpage.

<script src="form-storage.js"></script>

Apply the form-storage to your HTML form.

var formStorage = new FormStorage('.js-form');
formStorage.apply();

Save the current form status in the local storage.

formStorage.save();

You can specify an array of form fields to include or exclude.

var formStorage = new FormStorage('.js-form',{
    ignores: [],
    includes: [],
});

Create a checkbox to save data before submitting.

<label>
  <input type="checkbox" class="js-persist" />
  Allow saving form-data to localstorage.
</label>
var formStorage = new FormStorage('.js-form',{
    checkbox: '.js-persist'
});

Customize the localstorage name.

var formStorage = new FormStorage('.js-form',{
    name: 'form-storage'
});

Clear the stored data.

formStorage.clear();

Changelog:

01/14/2018

  • added getState and applyState medhod

You Might Be Interested In:


Leave a Reply