Input value of a form

Asked

Viewed 42 times

0

I’m developing a form with javascript/jquery in which from one question to another goes to another page and on the last page I have to see all the data typed in the previous questions, already tried with serializearray(),but it only takes the data from the last page, would like to know if you have any other method or even with serializearray.

javascript jquery

  • only with JS??

  • 1

    creates an imput Hidden with serializearray value and moves to the next page

  • Yes, it has to be with javascript, you could show me an example?

  • 1

    Already tried with localStorage?

  • No, actually I don’t know how to use the localstorage, can you give me a hand? some example or page that shows me how to use, I searched but did not understand right

  • 1

    I believe the best way for you to do that is with Localstorage. https://developer.mozilla.org/en-US/docs/Web/API/Web_Storage_API_pt_br/Using_the_Web_Storage_API

Show 1 more comment

2 answers

1

You can use localStorage as they said!

For example I did this Codepen to help you!

Here are two very good articles to understand how localStorage works:

Article 1

Article 2

1

Dude I’ll give you a basic example here and hope it helps you.

Page you take the value to transfer to another page: 

<input type="text" id="texto">
<a href="mostraDados.html"><button type="button" onclick="setaValor()">Pegar</button></a>

<script>
    function setaValor() {
        var texto = document.getElementById('texto');
        var textoValor = texto.value;
        var textoStorage = window.localStorage.setItem('valorTexto', textoValor);
    }
</script>

<style>
    input { border: solid 1px #ccc; border-radius: 2px; height: 20px; }
    button { border: solid 1px #ccc; border-radius: 2px; height: 30px; cursor: pointer;}
</style>

Page that receives the variable with the value of the previous page:

<input type="text" id="recebeTexto"> Valor trazido da página anterior 
<br><br>
<a href="setaDados.html"><button type="button">Voltar</button></a>

<script>
    function mostraValor() {
        var textoRecebido = window.localStorage.getItem('valorTexto');      
        document.getElementById('recebeTexto').value = textoRecebido;           
    }   

    window.onload = function() {
        mostraValor();
    };
</script>

<style>
    input { border: solid 1px red; border-radius: 2px; height: 20px; }
    button { border: solid 1px #ccc; border-radius: 2px; height: 30px; cursor: pointer;}
</style>

Browser other questions tagged javascript jquery

You are not signed in. Login or sign up in order to post.