I'm playing around with local storage, and in all logical sense, the code should work, but it breaks when I try local storage.my main html page is register.html\[code\]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title>Register</title><link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.css" /><link href="http://stackoverflow.com/questions/15913912/css/navigation.css" rel="stylesheet" type="text/css"><link href="http://stackoverflow.com/questions/15913912/css/body.css" rel="stylesheet" type="text/css"><script src="http://code.jquery.com/jquery-1.8.2.min.js"></script><script src="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js"></script><script src="http://stackoverflow.com/questions/15913912/register.js" type="text/javascript"></script></head><body><img src="http://stackoverflow.com/questions/15913912/images/Dance etc logo LARGE.jpg" width="263" height="150" alt="Dance Etc Logo" /><hr /><div data-role="header"> <h1>Dance Etc.</h1></div><div data-role="content" > <h1>Register</h1> <form method="post" action="" id="register" name="form"> <label>First Name: </label> <input type="text" id="firstName" /><br /> <label>Last Name: </label> <input type="text" id="lastName" /><br /> <label>Email: </label> <input type="text" id="email" /><br /> <label>Password: </label> <input type="password" name="password" /><br /> <input type="submit" value="http://stackoverflow.com/questions/15913912/Register" onClick="insertRecord()" /> </form></div><div data-role="footer"> <a href="http://stackoverflow.com/questions/15913912/Dance_Program">Contact Us</a> <a href="http://stackoverflow.com/questions/15913912/Register">Policy</a> <a href="http://stackoverflow.com/questions/15913912/Login">History</a></div></body></html>\[/code\]which uses the javascript register.js
var firstName = []; var lastName = []; var email = []; var password = []; var i;\[code\]function insertRecord() {$.ajax({ type: "GET", url: "studio.json", dataType: "json", success: insertData, error: function(){ alert("error"); }});function insertData(data) { if (localStorage) { for (i = 0; i < data.User.length; i++) { localStorage.setItem(firstName[j], data.User.firstName[j]); localStorage.setItem(lastName[j], data.User.lastName[j]); localStorage.setItem(email[j], data.User.email[j]); localStorage.setItem(password[j], data.User.password[j]); } localStorage.setItem(firstName, document.getElementById("firstName").value); localStorage[firstName] = document.getElementById("firstName").value; localStorage.setItem(lastName, document.getElementById("lastName").value); localStorage[lastName] = document.getElementById("lastName").value; localStorage.setItem(email, document.getElementById("email").value); localStorage[email] = document.getElementById("email").value; localStorage.setItem(password, document.getElementById("password").value); localStorage[password] = document.getElementById("password").value; alert(localstorage[firstName]); } else alert("Your browser does not support Local Storage");}}\[/code\]which get the information from studio.json
\[code\]{<br /> "Students":[<br /> { "first":"Arnold", "last":"Matthews", "class":"Tiny Tutus" },<br /> { "first":"Keesha", "last":"Franklin", "class":"Breakdancing"},<br /> { "first":"Dorothy", "last": "Ann", "class":"Acro"},<br /> { "first":"Wanda", "last": "Li", "class":"Ballet"},<br /> { "first":"Phoebe", "last": "Terese", "class":"Tap"}<br /> ],<br /> "Classes":[<br /> { "name":"Tiny Tutus", "time":"450","AMPM":"PM", "students":12},<br /> { "name":"Breakdancing", "time":"230","AMPM":"PM", "students":6},<br /> { "name":"Acro", "time":"810","AMPM":"AM", "students":15},<br /> { "name":"Tap", "time":"520","AMPM":"PM", "students":11},<br /> { "name":"Ballet", "time":"620","AMPM":"PM", "students":15},<br /> { "name":"Jazz", "time":"740","AMPM":"AM", "students":8 }<br /> ],<br /> "User":[<br /> {<br /> "firstName": "Michael",<br /> "lastName": "Jones",<br /> "username": "MJone",<br /> "email": "[email protected]",<br /> "password": "qwerty"<br /> },<br /> {<br /> "firstName": "Michelle",<br /> "lastName": "Lee",<br /> "username": "MLee",<br /> "email": "[email protected]",<br /> "password": "asdfgh"<br /> },<br /> {<br /> "firstName": "Andrew",<br /> "lastName": "Bob",<br /> "username": "ABob",<br /> "email": "[email protected]",<br /> "password": "zxcvbn"<br /> }<br /> ]<br />}\[/code\]
var firstName = []; var lastName = []; var email = []; var password = []; var i;\[code\]function insertRecord() {$.ajax({ type: "GET", url: "studio.json", dataType: "json", success: insertData, error: function(){ alert("error"); }});function insertData(data) { if (localStorage) { for (i = 0; i < data.User.length; i++) { localStorage.setItem(firstName[j], data.User.firstName[j]); localStorage.setItem(lastName[j], data.User.lastName[j]); localStorage.setItem(email[j], data.User.email[j]); localStorage.setItem(password[j], data.User.password[j]); } localStorage.setItem(firstName, document.getElementById("firstName").value); localStorage[firstName] = document.getElementById("firstName").value; localStorage.setItem(lastName, document.getElementById("lastName").value); localStorage[lastName] = document.getElementById("lastName").value; localStorage.setItem(email, document.getElementById("email").value); localStorage[email] = document.getElementById("email").value; localStorage.setItem(password, document.getElementById("password").value); localStorage[password] = document.getElementById("password").value; alert(localstorage[firstName]); } else alert("Your browser does not support Local Storage");}}\[/code\]which get the information from studio.json
\[code\]{<br /> "Students":[<br /> { "first":"Arnold", "last":"Matthews", "class":"Tiny Tutus" },<br /> { "first":"Keesha", "last":"Franklin", "class":"Breakdancing"},<br /> { "first":"Dorothy", "last": "Ann", "class":"Acro"},<br /> { "first":"Wanda", "last": "Li", "class":"Ballet"},<br /> { "first":"Phoebe", "last": "Terese", "class":"Tap"}<br /> ],<br /> "Classes":[<br /> { "name":"Tiny Tutus", "time":"450","AMPM":"PM", "students":12},<br /> { "name":"Breakdancing", "time":"230","AMPM":"PM", "students":6},<br /> { "name":"Acro", "time":"810","AMPM":"AM", "students":15},<br /> { "name":"Tap", "time":"520","AMPM":"PM", "students":11},<br /> { "name":"Ballet", "time":"620","AMPM":"PM", "students":15},<br /> { "name":"Jazz", "time":"740","AMPM":"AM", "students":8 }<br /> ],<br /> "User":[<br /> {<br /> "firstName": "Michael",<br /> "lastName": "Jones",<br /> "username": "MJone",<br /> "email": "[email protected]",<br /> "password": "qwerty"<br /> },<br /> {<br /> "firstName": "Michelle",<br /> "lastName": "Lee",<br /> "username": "MLee",<br /> "email": "[email protected]",<br /> "password": "asdfgh"<br /> },<br /> {<br /> "firstName": "Andrew",<br /> "lastName": "Bob",<br /> "username": "ABob",<br /> "email": "[email protected]",<br /> "password": "zxcvbn"<br /> }<br /> ]<br />}\[/code\]