How to pass the value of an input field to a JavaScript variable, and then display this value on another page of the site?

M

msnyastar2020-02-02 14:02:16

JavaScript

msnyastar, 2020-02-02 14:02:16

Hello! I'm a beginner, don't judge strictly: It is
necessary to pass the values of the filled form fields (the form is on the first page):

<body>
    <form name="n1">
      <fieldset>
        <legend>Пример формы</legend>
        <p>
            <label for="field-1">Поле 1</label>
            <input type="text" id="field-1" name="value1">
        </p>
        <p>
            <label for="field-2">Поле 2</label>
            <input type="text" id="field-2" name="value2">
        </p>
      </fieldset>
    <p><input type="button" value="Отправить" onClick="Complete();"></p>
    </form>

    <p id="val1"></p>
    <p id="val2"></p>

<script src="p3.js"></script>
</body>

Pass to JavaScript variables on button click under the form (Submit):

Then display these values on another page (second page), for example, here, as soon as the page is loaded:

<body>

<p id="val1"></p>

<script src="p3.js"></script>
</body>

For these purposes, I connected the script in a separate file, I connect it before closing the "body", how much I do not understand this correctly.
The script so far looks like this:

function Complete()
{
    var v1 = document.n1.value1.value;
    var v2 = document.n1.value2.value;
    document.getElementById("val1").innerHTML = v2;
    alert(v1);
}

On the first page, after pressing the button, the value gets into , but I don’t know how to make it so that when the second page is loaded, the same values \u200b\u200bare displayed on it.
Can you please tell me a better option?

Reply

Answer the question

In order to leave comments, you need to log in

2 answer(s)

S

Shohruh Shaimardonov, 2020-02-02
@msnyastar

Use localStorage to share data between pages. The simplest crutch

S

Soul1Eat, 2020-02-02
@Soul1Eat

Add an input attribute
name="test"
Then wrap the input along with the button in

<form method="GET" action="путь к вашей странице">сюда кнопку и input</form>

Then on another page the script:

const urlParams = new URLSearchParams(window.location.search);
const myParam = urlParams.get('test');
window.addEventListener("load", function() {
    const el = document.querySelector("primer1");
    el.innerText=myParam;
  });