JavaScript Library Stores Form Data in Local Storage | form-storage

Form Storage JavaScript library stores form data in local storage so you never have to fill in the form again and this plugin store the current values of your form fields in local storage to prevent data loss.

how to store multiple form data in localstorage using javascript, save form data to local storage, how to display local storage data in html

Prevent Data Loss In The Form By Refreshing Page | oops.js

How to make use of it:

Install the form-storage by way of 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 instantly embrace 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 present form standing within 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 lots of information earlier than submitting it.

<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 local storage name.

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

Clear the stored information.

formStorage.clear();

Save Form Changes In Local Storage, Form Storage Plugin/Github


See Demo And Download

Official Website(appleple): Click Here

This superior jQuery/javascript plugin is developed by appleple. For extra Advanced Usages, please go to the official website.

Leave a Comment