Languages

Menu
Sites
Language
problems with localstorage

Hi everyone.

First of all, sorry for my english, I know it not very good...

The application has two text fields (name and url). The user enters data into this fields. The application receives and stores the data in local memory like as follows:

<"user_data_0", "Tom">&<"Tom", "Tom's url">;

...

<user_data_N, "Jerry">&<"Jerry", "Jerry's url">;

That's how I try to do this:

function addData(){
    var name = document.getElementById("name").value;
	var url = document.getElementById("url").value;
	var next_number;
	next_number=localStorage.getItem('next');//"next" is a value of next number for adding 
    if(next_number){
    	var key_name = "user_data_"+next_number;
    	next_number++;
    }
    else {
    	var key_name = "user_data_0";
    	next_number=1;
    }
	/* Set the local storage item */
    if("localStorage" in window){ 
    	localStorage.setItem(key_name,name);
    	localStorage.setItem(name,url);
    	localStorage.setItem('next',next_number);
    }
}

Then I tried to pull data from locale:

var i = 3;// it's for example. I will receive values in the loop
alert(localStorage.getItem("user_data_"+i));

But when I started testing, it's returned data from localstorage with key "next". Why? And as it can be corrected? 

Thanks.

Edited by: Anton Chernenkov on 23 Oct, 2013

Responses

1 Replies
Raghavendra Reddy Shiva

Have modified your code as below and it now works great. 

// global variables
var localStorage=null;

function getLocalStorageObject() {      // function to get the localstorage object

    console.log('getLocalStorageObject called');
     if(window.localStorage ) {
        console.log('LocalStorage supported');
        return window.localStorage;
     }
     else {
         console.log('LocalStorage not supported');
         return undefined;
     }
}

function setLocalStorage() {    
     console.log('setLocalStorage called');
     var name = document.getElementById("name").value;
     var url = document.getElementById("url").value;
     var next_number;
     
     // Get the LocalStorage Object
     localStorage= getLocalStorageObject();
        
     if (localStorage!=undefined) {                
            if (localStorage.getItem('InitialValue') !='set')
            {
              // This should be done only once
              console.log('Initializing localstorage key/value');
              localStorage.setItem('InitialValue','set');
              localStorage.setItem('next','0');
            }
            
            next_number = localStorage.getItem('next'); //"next" is a value of next number for adding 
            if(next_number){
                var key_name = "user_data_"+next_number;
                next_number++;
            }
            else {
                var key_name = "user_data_0";
                next_number=1;
            }            
            /* Set the local storage items here */
            localStorage.setItem(key_name,name);
            localStorage.setItem(name,url);
            localStorage.setItem('next',next_number);
            console.log('details added to LocalStorage');                      
     }
}

function getLocalStorageInfo() {   // Function to retrieve the localstorage data 
     var key, value;
     console.log('retreiving LocalStorage info');     
     if(!localStorage){
        // Get the LocalStorage Object
         localStorage= getLocalStorageObject();
     }     
     var storageCount= localStorage.length;
     if (storageCount){
         for (i=0; i<=localStorage.length-1; i++) {
           key = localStorage.key(i);
           value = localStorage.getItem(key);
           console.log('key: '+ key+ '  Value: '+ value);    
         }
     } 
     else {
         console.log("LocalStorage not used");
     }
}

When i added 2 entries to localstorage, i get below details when retrieved.

retreiving LocalStorage info
key: next  Value: 2
key: samar  Value: google.com
key: user_data_0  Value: samar
key: InitialValue  Value: set
key: user_data_1  Value: raman
key: raman  Value: gmail.com