const tr = document.createElement("tr");
const td = document.createElement("td");
table.appendChild(tr);
td.innerText = "" + new Date().toLocaleDateString("de-Ch");
tr.appendChild(td);
const td2 = document.createElement("td");
td2.innerText = object.text;
tr.appendChild(td2);
const td3 = document.createElement("td");
if (object.amount > 0){
td3.style.color = "rgb(4, 209, 4)";
td3.innerText = "+";
} else{
td3.style.color = "red";
}
td3.innerText += object.amount;
tr.appendChild(td3);
const td4 = document.createElement("td");
td4.style.color = saldo < 0 ? "red" : "black";
td4.innerText = saldo.toFixed(2);
tr.appendChild(td4);
Basically this code gets ran when I submit a form and it adds a tr and td's to a table which I already have as elementById. My question is, does anyone know how I could store the values, that I input, as localStorage, so that when I refresh, the table with the different rows stays as before and that I can still add more rows? I'd be very thankful for an answer. If there's more information about the code needed, I'd be happy to provide it.
You can create an object array and add it in localStorage if it is not available.
var objectArray = [];
localStorage.setItem("objectArray", JSON.stringify(objectArray))
Add objects to the array when form is submitted and update localStorage.
var objectArray = JSON.parse(localStorage.getItem("objectArray"));
objectArray.push(object);
localStorage.setItem("objectArray", JSON.stringify(objectArray));
update the table with new rows based on the objects available in the array.
var objectArray = JSON.parse(localStorage.getItem("objectArray"));