Values from one form to another

1

No index.html will have a pre-form with name, email, city and UF.

I will need to get this data and play to another form that will be in another html file.

I have a certain notion in jQuery, but I wonder if I'm going to have to use ajax or sessionStorage or something else.

    
asked by anonymous 27.03.2017 / 21:05

2 answers

0

I have already solved the problem, and I used the localStorage

$('.link-enviar').on('click', function(e){
  var nome1 = $('#nome1').val();
  var email1 = $('#email1').val();
  var cidade1 = $('#cidade1').val();
  var uf1 = $('#uf1').val();

  localStorage.setItem('nome',nome1);
  localStorage.setItem('email',email1);
  localStorage.setItem('cidade',cidade1);
  localStorage.setItem('uf',uf1);
});

$(function(){
  var nome = localStorage.getItem('nome');
  var email = localStorage.getItem('email');
  var cidade = localStorage.getItem('cidade');
  var uf = localStorage.getItem('uf');
  $('#empresa').val(nome);
  $('#email').val(email);
  $('#cidade').val(cidade);
  $('#uf').val(uf);
})'

In this way I did a click event, where you get the values of the forms, playing to localStorage .

Soon after I did an anonymous function that runs along with the page, placing the localStorage values in the forms. You gave it right, thanks to anyone who wanted to help.

    
27.03.2017 / 22:05
2

You can try this out

1st Form: formA.html

<body>
    <form action="formB.html" method="get">
      Name: <input type="text" name="nome">
      <input id="submit_button" type="submit" value="PAGINA B &raquo;">
    </form>
</body>

2nd Form: formB.html

<body>
    <form action="processar.php" method="post">
      Nome: <input type="text" name="nome">
      Idade: <input type="text" name="idade">
      <input type="submit" value="SALVAR DADOS">
    </form>
   <script type="text/javascript">
       var query = window.location.search.substring(1);
       var Field=query.split("=");
       document.getElementById("nome").value = Field[1];
   </script>
</body>

Then you can use a regular expression to remove the + of the expression.

Another option might be HTML5 functionality, localStorage or sessionStorage which is less permanent:

Part 1: A.html

<form action="B.html" onsubmit="return validar(this)" method="post">
Nome: <input type="text" name="fnome">
<input type="submit" value="PAGINA B &raquo;">
</form>

<script>
function validar(form){
    if(typeof(Storage) !== 'undefined'){
        if(form["fnome"].value != ""){
            sessionStorage.setItem('nome', form["fnome"].value);
            return true;
        } else {
            alert('Preencha o campo');
        }
    } else {
        alert('O navegador nao suporta storage');
    }
    return false;
}
</script>

Part 2: B.html

<form action="validar.php" method="post">
Name: <input type="text" name="fnome">
Idade: <input type="text" name="fidade">
<input type="submit" value="Salvar">
</form>

<script>
if(typeof(Storage) !== 'undefined'){
    var form = document.querySelector("form");
    if(sessionStorage.getItem('nome')){
        form["fnome"].value = sessionStorage.getItem('nome');
        form.addEventListener('submit', function(ev){
            ev.preventDefault();
            if(form["fnome"].value != "" && form["fidade"].value > 0){
                alert('Dados digitados:\n\nNome: ' + form["fnome"].value + "\nIdade: " + form["fidade"].value + "\n\nA enviar para servidor...");
                sessionStorage.clear();
                this.submit();
            } else {
                alert("Preencha os campos em branco");
            }
            return false;
        });
    } else {
        form["fnome"].value = "sem nome";
    }
} else {
    alert('O navegador nao suporta storage');
}
</script>
  

You can also see the first example in SOen .

    
27.03.2017 / 21:45