Click here to Skip to main content
14,691,000 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
I am making a note taking app:
Basic HTML:
  <input type = "text" id = "noteinput">
     <button id = "takenote">Add</button>
<b<h1 id = "print"></h1>

Here is the javascirpt:
var takeNote = document.getElementById('takenote');

takeNote.addEventListener('click', () =>{
    var date = Date();
var post = document.getElementById("noteinput").value;
        localStorage.setItem('userInputValue',post)
    document.getElementById("print").innerHTML = `Note to self: ${post}`;
});  
    window.addEventListener('load',()=>{
        var savedUserData = localStorage.getItem('userInputValue');
        document.getElementById("print").innerHTML = savedUserData;
 
 
});

It takes the user input and displays it on the screen, even after the page has been reloaded.
But, my question is, how do I do multiple input and stack that input on top of the last?

What I have tried:

I really dont know what to try, so please help.
Thanks!
Posted
Updated 21-Aug-20 7:34am

1 solution

Looking at your code, mostly it is around using localstorage via Javascript. For your stack of notes:
1. Use arrays to store data in localstorage
2. Use JSON.stringify() to convert data array into string
3. Use JSON.parse() to convert back for manpulations

Reference: How to Use Local Storage with JavaScript - Integrating local storage[^]

Try out!
   
Comments
landocss 21-Aug-20 12:47pm
   
Thank you very much, but I am still a little confused.
landocss 21-Aug-20 13:04pm
   
Do you think you could just show me how to implement that into my code please?
Sandeep Mewara 21-Aug-20 13:26pm
   
I gave a url that has all the details. Please have a look at it and then just do it. I don't see why would you get stuck. Please try.
landocss 21-Aug-20 13:32pm
   
Ok I will try.
landocss 21-Aug-20 13:48pm
   
I am so sorry, I can't seem to get it to work :(

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)




CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900