Remember.js is a lightweight but flexible javascript library to help you save user settings and data between sessions.

It was born out of an upcoming news reader project where I found myself continuously hassled by errors and incompatibilities when saving user settings on the client-side. I decided it was time to create a library that did everything I needed and more. So here you have it, remember.js

Usage

· via HTML

To remember an elements value, simply add the data-remember attribute

For example:

<input type='text' data-remember>
<input type='checkbox' data-remember>
<select data-remember>
    <option>Option 1</option>
    <option>Option 2</option>
    <option>Option 3</option>
<select>

· via Javascript

To remember a value using javascript, you should call

var myElement = document.getElementById("#myElement");
new remember.Control(myElement, options);

with the arguments:

• myElement · The HTMLElement to remember the value of.
• options · An optional Object with the following attributes:
  • get · A function that will return the value to be saved of the element stored in this.element.
    
    Example for text input: function(){ return this.element.value }
    Example for checkbox: function(){ return this.element.checked }
    Example for select: function(){ return this.element.selectedIndex }
  • set · A function to set the value of the element.
    
    Example for text input: function(val){ return this.element.value = val }
    Example for select: function(val){ return this.element.selectedIndex = val }
  • reset · A function used to reset the value of the element to it's default. The default value is stored in this.def
    
    Example for text input: function(){ return this.element.value = "This is the default value" }
    Example for select: function(){ return this.element.selectedIndex = this.def }
  • def · The default value of the element, this will be used used by the reset function
    

Once all the elements are registered, use

remember.save();
remember.load();
remember.reset();

to save, load and reset the elements values respectively.

For examples of correct usage and some extra features, check out the Demo page.

Download

To use remember.js, include the following file just before your closing body tag

Contribute

View the project on Github. Feel free to fork or contribute!