0

I am trying to make and app, with html and JavaScript, that I can submit data through a text input and recall it later through another text input. The idea of this app is to submit words that I have already used in my Chinese lesson and then, when I prepare another lesson, to be able to search through this app if I have used a specific word before or not.

I left my code below. I know this is probably a very basic thing, but I tried to research it and I didn't find anything specific enough:

<!DOCTYPE html>
<html>
<body>
    <form>
<input type="text" id="textbox2" placeholder="Submit here" required>
    </form>
    <form>
<input type="text" id="textbox1" placeholder="Search here" required>
    </form>
    <script type="text/javascript">
    </script>
    </body>
</html>
norbitrial
  • 14,716
  • 7
  • 32
  • 59
Robert B
  • 67
  • 5
  • Does this answer your question? [Save input data to localStorage on button click](https://stackoverflow.com/questions/10333230/save-input-data-to-localstorage-on-button-click) – Heretic Monkey Dec 25 '19 at 22:30

2 Answers2

0

You'll need to call the functions when appropriate of course, but this is pretty simple.

<!DOCTYPE html>
<html>
    <body>
        <form>
            <input type="text" id="textbox1" placeholder="Submit here" required>
            <button onclick="event.preventDefault();saveFirstInput();">Save submission input</button>
       </form>
        <form>
            <input type="text" id="textbox2" placeholder="Search here" required>
            <button onclick="event.preventDefault();populateSecondInput();">Recall submission input</button>
        </form>

        <script type="text/javascript">
            function saveFirstInput(){
                window.localStorage.setItem("firstInputValue", document.getElementById("textbox1").value);
                document.getElementById("textbox1").value = "";
            }

            function populateSecondInput(){
                var savedValue = window.localStorage.getItem("firstInputValue") || "";
                document.getElementById("textbox2").value = savedValue;
            }
        </script>
    </body>
</html>
Aaron Plocharczyk
  • 2,776
  • 2
  • 7
  • 15
  • Thank you, I've tried this code but it doesn't work. If I try to use the "Search here" input to search for a word that I have submitted through the "Submit here" input, it doesn't do nothing. – Robert B Dec 25 '19 at 13:18
  • Did you call the functions? I updated my code to show you how. – Aaron Plocharczyk Dec 25 '19 at 21:50
-1

I guess you are missing a basic concept for app development - from an architecture point of view you will need some kind of database to connect to and send your information to.

I personally think, that Angular is a great Framework with a great documentation and a great tutorial - check it out here: https://angular.io/docs

If you are not familiar with javascript and html I suggest you work first through these tutorials: https://www.w3schools.com/js/

After you managed to solve some basic things I think you should use firebase to get some severless backend functionality like database access. Angular is working great with firebase!

http://firebase.google.com/

https://github.com/angular/angularfire/blob/master/docs/install-and-setup.md

If you anyway want to use localstorage, have a look here: https://developer.mozilla.org/de/docs/Web/API/Window/localStorage

Kennuel
  • 169
  • 7
  • Yes, I have a lot more to learn. Thank you for all the materials ! – Robert B Dec 25 '19 at 13:18
  • “You will need some kind of database” Not true at all. Not every app has to scale to 10 000 users a minute or support dozens of different devices. Sometimes it’s okay for an app to be small and target a small user base and therefore have a smaller footprint. No need to include Kilobytes of JavaScript for an app the OP is only ever going to use themselves. Learn drive on a simple car, not on a manual double-clutch 18-wheeler. – Heretic Monkey Dec 25 '19 at 22:25
  • Well, you are totally right, when you say: learn to drive a simple car, not a Truck and indeed when using angular you will have a big overhead in terms of size. But even simple apps, can and often should have access to a DB - regardless of the amount of users or services- This comparison is flawed. Further it is a great oportunity to directly learn a few things. Anyway, from my experience with beginners is, that they often have more fun when learning angular instead of plain javascript, because it is much easier to get great things working in a very short timeframe. – Kennuel Dec 26 '19 at 02:05