Week 12: Local Storage
1. Slides – localstorage (2)
2. Example Final Projects
- a. http://home.ubalt.edu/students/id95rx02/newborn.html
- b. https://home.ubalt.edu/clayton.zook/idia619final/IDIA619_final_czook.html
- c. http://www.staticmud.com/IDIA619/FINAL/RehabGuessWho-v4.html
- d. http://home.ubalt.edu/students/ID51GC84/IDIA619/finalProject.html
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>