Choogy - Javascript Web Local Storage

Add Delete Find Filter ForEach IndexOf Map Chain Functions BrowserStorage Promise Back

Store to Web Browser Memory

You can store data to web browser of up till 10MB and data will still persist even after closing web browser.

You can save to local storage using LocalStorage().

Copy the code below & save file as object.html:

<form>
Add Name: <input type="text" id="h_name" value="Three">
Add Contact: <input type="text" id="h_ct" value="123"><br>
</form>

<button type="submit" onclick="Add()">Add To Browser Storage</button>
<button type="submit" onclick="Retrieve()">Retrieve Browser Storage</button>
<button type="submit" onclick="Clear()">Clear Browser Storage</button>

<h4>Details:</h4>
<h4 id="out"></h4>

const arr = [ {name:"Sample1", contact:"123"}, {name:"Sample2", contact:"456"} ];
let newData = { name: "", contact: "" };

function Add() 
{
document.getElementById("out").innerHTML = "";

var h_name = document.getElementById("h_name").value;  
var h_ct = document.getElementById("h_ct").value;

let newData = new Object();
newData.name = h_name;
newData.contact = h_ct;
arr.push(newData);

if(typeof(Storage) !== "undefined")
{
localStorage.setItem("ARRAY_AS_KEY", JSON.stringify(arr));
document.getElementById("out").innerHTML = "Stored Array to Browser" + "<br>" 
 + "Close & Open browser then press Retrieve button to view";
}
else { alert("Browser not supported"); }
}

function Clear() 
{
document.getElementById("out").innerHTML = "Browser Storage Cleared";
localStorage.removeItem("ARRAY_AS_KEY");
//localStorage.clear(); clears all in browser
}

</script>