Skip to main content

Posts

Showing posts from April, 2013

Using HTML5 SessionStorage in forms.

The two local storage mechanisms in HTML5, 'LocalStorage' and 'SessionStorage' are really nifty when you need to store the data temporarily but don't want to involve any server side interaction.

I wanted to create a small HTML-form page which would allow user to enter data in various fields and on submitting the form, just show the data submitted in a text-format (easy for copy-paste). And if needed allow the data to be edited by repopulating the data in the fields.

Something like this:

On submitting, the entered data shows up like this:

On reloading the page, once again we get the first page with data populated in the fields. Pretty cool eh?

I decided to use sessionStorage for this. Idea is very simple (and you will notice that implementation is as simple!).

Before starting with sessionStorage or JS code, let's take a look at the form HTML code:


<form id="bct" >
<label>Problem Description/Current Behavior:</label>
<textarea name=&q…