Week 12: Local Storage

1. Slides – localstorage (2)

2. Example Final Projects

3. Sample Code

<script>// <![CDATA[
 window.onload = init;
function init() {
 var button = document.getElementById("submit");
 button.onclick = storeGroceryList;
 
 for (var i = 0; i < localStorage.length; i++) {
 var ul = document.getElementById("groceriesList");
 var key = localStorage.key(i);
 var value = localStorage.getItem(key);
 var currQuant = document.createElement("li");
 currQuant.innerHTML = key + ": " + value;
 ul.appendChild(currQuant);
 } 
 }
function storeGroceryList(){
 var eggField = document.getElementById("eggs");
 var eggsNum = eggField.value;
 var milkField = document.getElementById("milk");
 var milkNum = milkField.value;
 var breadField = document.getElementById("bread");
 var breadNum = breadField.value;
 
 localStorage.setItem("milk", milkNum);
 localStorage.setItem("bread", breadNum);
 localStorage.setItem("eggs", eggsNum);
 }<
/* This test function was showing off some of the test actions of local storage
 function testInfo(){
 localStorage.setItem("sticky_0", "Pick up dry cleaning");
 localStorage.setItem("sticky_0", "Clean litter box");
localStorage.setItem("sticky_0", 3);
var store = parseInt(localStorage.getItem("sticky_0"));
store += 4;
localStorage.setItem("sticky_0", store);
} */
// ]]></script>
Please enter the quantity of each item below:
<form><label>Milk: <input id="milk" type="text" width="15" /></label> <label>Bread: <input id="bread" type="text" width="15" /></label> <label>Eggs: <input id="eggs" type="text" width="15" /></label> <input id="submit" type="submit" value="Ok" /> </form>Your groceries:
<ul id="groceriesList"></ul>

<html>
<head>
<script>

//localStorage.setItem("sticky_1", "Kiss the baby");
var numOfEmails = [2056,6546,545];
//var numOfEmails = ["morning" = ["2056"],"afternoon" = ["6546"],"evening" = ["545"]]
//var numOfEmails = new Array();

var storedNotification = JSON.stringify(numOfEmails);
sessionStorage.setItem("my_Emails", storedNotification);

var oldEmails = JSON.parse(sessionStorage.getItem("my_Emails"));
for(var i = 0; i < oldEmails.length; i++){
 console.log(oldEmails[i]);
}
</script>
<body>
</body>
</html>

Comments are closed.