FormAutoSave Demo

Try It Out - Contact Form

Start typing in the fields below and keep your eyes on the top right of the screen.
Refresh the page to see your data restored!

Name

Email

Phone

Subject

Message

Subscribe to newsletter

I agree to the terms and conditions

How It Works

Data is saved automatically as you type
Stored securely in your browser's localStorage
Automatically restored when you return
Data expires after 7 days (configurable)
Password fields are never saved
Works with multiple forms on one page

Quick Start

<!-- Add class to your form -->
<form class="form-autosave" id="myForm">
    <input type="text" class="form-control" name="name">
    <button type="submit" class="btn btn-primary">Submit</button>
</form>

<!-- Include the script -->
<script src="formAutoSave.js"></script>

That's it! Your form will now automatically save and restore data.

API Methods

Manual Save

formAutoSave.saveForm('demoForm');

Manual Clear

formAutoSave.clearForm('demoForm');

Save All Data

formAutoSave.saveAllForms();

Clear All Data

formAutoSave.clearAllForms();

Export Data

formAutoSave.export('demoForm');

Storage Info

formAutoSave.getStorageInfo();

Configuration Options (for this demo)

Option	Default	Description
`formSelector`	`'.form-autosave'`	CSS selector for forms
`statusSelector`	`#statusbar`	Global status element
`storagePrefix`	`form_autosave_`	Prefix for storage keys
`debounceDelay`	`500`	Delay in milliseconds
`maxAge`	`7 days`	Data expiration time
`useSessionStorage`	`false`	Use sessionStorage instead of localStorage
`useSilentMode`	`false`	Auto-restore without prompt
`showNotifications`	`true`	Show save status indicators

FormAutoSave

Auto-Save

Secure

Configurable