Solved

localStorage problem

Posted on 2014-03-21
3
211 Views
Last Modified: 2014-03-28
Hi,

I have a problem with accessing the localStorage values in my HTML5 application.

I am setting the localStorage key, groups at the top of my javascript file to an object as follows...

localStorage.setItem('groups', JSON.stringify(groups));

Open in new window


Within the document.ready part of my script I attempt to retrieve the value as follows...

function ShowList() {
    var groups = JSON.parse(localStorage.getItem('groups'));
    console.log(groups);
}

Open in new window


Inspecting the Firebug console shows, undefined for the log.  However, if I place an alert("HELLO") before groups is defined, the localStorage object is returned correctly...

function ShowList() {
    alert("HELLO");
    var groups = JSON.parse(localStorage.getItem('groups'));
    console.log(groups);
}

Open in new window


I think this may be to do with the DOM lifecycle, but can't figure it out.  

PLEASE HELP!!!
0
Comment
Question by:nickmarshall
  • 2
3 Comments
 
LVL 13

Expert Comment

by:devlab2012
ID: 39944908
Do you have both the statements setItem and getItem in the same script file?

It might be the order in which you are using the javascript files. In general, localStorage is available in the document.ready and you may use it without any issue. Following is a simple HTML page, that uses the same code as listed by you:

<!DOCTYPE html>
<html>
<head>
    <title>Test</title>
    <script type="text/javascript" src="jquery-1.7.2.js"></script>
    <script language="javascript" type="text/javascript">

        var groups = "Test localStorage";
        localStorage.setItem('groups', JSON.stringify(groups));

        $( document ).ready(function() {
            //SaveList();
            ShowList();
        });

        function ShowList() {
            var groups = JSON.parse(localStorage.getItem('groups'));
            console.log(groups);
        }
    </script>
</head>

<body style="width:220px;">
This is HTML body.
</body>
</html>

Open in new window


NOTE: To test the above code, make sure that you correctly include the jquery file referenced in this code.
0
 
LVL 1

Accepted Solution

by:
nickmarshall earned 0 total points
ID: 39949690
I was resetting the localStorage at the beginning of my script - Removing this fixed the issue.
0
 
LVL 1

Author Closing Comment

by:nickmarshall
ID: 39961064
Fixed myself.
0

Featured Post

Networking for the Cloud Era

Join Microsoft and Riverbed for a discussion and demonstration of enhancements to SteelConnect:
-One-click orchestration and cloud connectivity in Azure environments
-Tight integration of SD-WAN and WAN optimization capabilities
-Scalability and resiliency equal to a data center

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
cookies analysis tools 2 100
.php tree directory? 5 83
Web Fraud scenarios to PoC F5  web fraud prevention 7 48
QQ problem 22 43
The purpose of this article is to demonstrate how we can use conditional statements using Python.
International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Wufoo.com provides powerful tools for surveying targeted groups, and utilizing data from completed surveys to find trends, discover areas of demand or customer expectation, and make business decisions on products or services.

860 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question