Yaron Silbershatz
Yaron Silbershatz

Reputation: 31

saving user input on websites

i am making a website for my workplace and i need the content to remain on all the computers that access the site

i have the code for it and i just need to make it stay on the site

<html>
<body>
<input type='text' id='idea' />
<input type='button' value='add to list' id='add' />
<br>
<ul id='list'></ul>

<script>
document.getElementById("add").onclick = function() {
    //First things first, we need our text:
    var text = document.getElementById("idea").value; //.value gets input values

    //Now construct a quick list element
    var li = "<li>" + text + "&nbsp" + "<input type=checkbox>" + "Ready" + "</input>" + "&nbsp" + "<input type=text>" + "</input>" + "</li>";

    //Now use appendChild and add it to the list!
    document.getElementById("list").innerHTML += li;
}
</script>



</body>
</html>

so it would be amazing if someone can fins me an easy and simple solution. Thank you

Upvotes: 1

Views: 1739

Answers (3)

pasanjg
pasanjg

Reputation: 646

Create a JavaScript object with the values you want to store. (Can be an object or a single variable)

var userObj = {
        "name": "John",
        "age": "30"
}

Set the object or variable to the localStorage

localStorage.setItem("userDetails", userObj);

Use the same userDetails keyword to access the storage values.

var details = localStorage.getItem("userDetails");

Upvotes: 0

user10011335
user10011335

Reputation:

Probably the simplest way to do it: You could use local storage to store the data on the user's machine. But keep in mind - the data will be deleted as soon as the user clears their local storage.

// Get stored text (undefined if nothing stored)
const storedIdea = localStorage.getItem("storedIdea");

// Store text
localStorage.setItem("storedIdea", text);

If you want something more persistent you'll have to use authentication and a backend (you could give Firebase a try!).

Upvotes: 1

albert_anthony6
albert_anthony6

Reputation: 614

Window.localStorage is what you can use to locally store data even after the page unloads. The data will remain, be accessible, and modifiable every time you load and unload the page.

Upvotes: 0

Related Questions