How to make client side storage using jQuery

Storing value for web apps are quite useful so that it can be used later for some operation. One can store value on server side like using application, session variable in ASP.NET or can also store value on client side.
jQuery plugin called lostorage.js uses the HTML5 localStorage and sessionStorage APIs to provide a persistant client-side storage, mainly targeted at web apps. It has a cookie.js like interface. Some facts:

  • The minified version is 2.0 KiB large, 0.87 KB if minified and gzipped.
  • It has no dependencies.
  • You can store any kind of data with lostorage.js: Booleans, numbers, strings, arrays and plain objects. With the usual localStorage you can just read strings.
  • lostorage.js supports chaining.

How to use it?

//Code Starts
storage.empty().set({ 
  list: [1, 2],
  counter: 1
});

// Later

storage.push('list', 3, 4);
storage.increase('counter');

// And read the values:

storage.get('list'); // [1, 2, 3, 4]
storage.get('counter'); 2
//Code Ends

lostorage.js works in every browser that supports web storage and parsing JSON / serializing to JSON. That's pretty much every browser you might want to support except IE6 and 7:

  • Internet Explorer 8+
  • Mozilla Firefox 3.5+
  • Google Chrome 4+
  • Safari 4+
  • Opera 10.5+

Feel free to contact me for any help related to jQuery, I will gladly help you.



Responsive Menu
Add more content here...