Use IE userdata behavior as a client-side data storage

I described how to use jStore as a client-side persistent storage in my last post. The jStore manage a number of different storage engines, such as gears and flash objects. But they all need additional downloads.

The IE browser has provide a mechanism called userdata behavior to store max 128kb data a page, 1024kb a domain. This is a portion of DHTML that suppoted by IE5 or later. Refer to this article: userData Behavior.

The userdata behavior is much like what cookie does, but it supply a much bigger storage. The data is stored in the C:\Documents and Settings\User Name\UserData\ folder, which will be visible even if you refresh the page or re-open the IE browser. The data will always exist, unless you delete it manually or set the expire date.

Here is an example:

$(function() {   

var userData = $('#userData')[0];

$('#getData').click(function() {

  $('#data').val('');

  userData.load('my_user_data_storage');

  $('#data').val(userData.getAttribute('data_1'));

  });

$('#saveData').click(function() {

  userData.setAttribute('data_1', $('#data').val());

  userData.save('my_user_data_storage');

  });

});

<div id="userData" style="behavior: url(#default#userData);">

</div>

<input id="data" type="text" />

<input id="getData" type="button" value="Get Data" />

<input id="saveData" type="button" value="Save Data" />