Locally-Stored Form Fields

JavaScript Snippet
JavaScript
Github Gist

What It Is

JavaScript that auto-populates form fields with whatever was last submitted.

Details

Just add an attribute to your form fields in HTML:

<input name="apiKey" data-storage-key="saved_api_key"/>

When the form submits, whatever is in that field will be saved to browser storage under the key saved_api_key. When the page is reloaded, whatever is in browser storage under the key saved_api_key will be pre-filled in that field.

This is handy for API keys that I want submitted with every request, but I don’t want to have to enter every time I submit. Usually, I just enter the once, and then they’re just pre-populated every time I visit that page.

Note that this doesn’t affect form handling in any way. The value is still submitted and you can do whatever you want on the server. All this does is save you from having to type something in the field every time. The form will just auto-fill from whatever was submitted last.

I use this quite a bit on random utility pages.