How to make the input values show up in a different page with javascript?

Question

I'm trying to make the input values in one of my html pages to show up in another one of my html pages ?

My code is as follows in the first page.

  <div class="resume-input">
    <h3>SUMMARY: </h3>
    <textarea name="Summary" placeholder="If its more than 100 words no one is going to read it" id="textarea" cols="30" rows="10"></textarea>
  </div>

And this is my html code in the page where the input values should show

  <div class="col-md-12">
    <center>
      <h1><div id="summary"></div></h1>
    </center>
  </div>

my JS looks like this

document.querySelector('#button1').addEventListener('click', function(){
  var summary = document.querySelector('#textarea').value;
  var summaryInput = document.querySelector('#summary');
  summaryInput.textContent = summary
  window.location = 'results.html'
})

the window.location = 'results.html' allows the button to redirect the input values to another page with the input values from the previous page.

Either `'results.html?sum='+summary` and read `location.search` or try local/sessionStorage — mplungjan, Aug 27 '18 at 17:33
You could store the values in [localStorage](https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage)/[sessionStorage](https://developer.mozilla.org/en-US/docs/Web/API/Window/sessionStorage) and then populate them on the other page that way. — APAD1, Aug 27 '18 at 17:33

brk · Answer 1 · 2018-08-27T17:51:32.207

0

On button click store the value in localStorage using

localStorage.setItem("anyKeyName","here goes the value from textarea")

and on loading the results.html retrieve the value of

summaryInput.textContent = localStorage.getItem("anyKeyName")

Also look at window.onload

edited Aug 27 '18 at 17:51

answered Aug 27 '18 at 17:36

brk

48,835
10
56
78

There is a mistake: `localStorage.set` is `localStorage.setItem` and `localStorage.getItem` instead of `get`. – E. Zacarias Aug 27 '18 at 17:38
1

@E.Zacarias apologies for the mistake, thanks for pointing it – brk Aug 27 '18 at 17:42
So does localStorage.set("anyKeyName") pull the "here goes the value from the text area" and then when you go to the results.html you put localStorage.get("anyKeyName") to pull the the value from the textarea from the previous page? – Aug 27 '18 at 17:44
There is no such thing as window.load – mplungjan Aug 27 '18 at 17:50

How to make the input values show up in a different page with javascript?

1 Answers1