Pass an input value from page 1 to another input on page 2

Asked

Viewed 103 times

1

beauty?

I have a specific calculator and I want that when you click on the button it calculates and shows the values on another page. I tried to use window.open and I couldn’t. To open on the same page using the _self parameter I got it with this information; only to open at a specific address that does not.

	 <script> function calculadora(){
		var v1 = document.getElementById("valor_1").value;
		var v2 = document.getElementById("valor_2").value;
		var v3 = document.getElementById("valor_3").value;
		document.form.campo1.value = v1/2;
		document.form.campo2.value = v2/3;
		document.form.campo3.value = v3/4;
		document.form.total.value = v1/2 + v2/3 +v3/4;	 
	 }
	 </script>
	 
	 <script> novajanela(){
	 myWindow = window.open("https://www.novajanela.com/");
	 document.form.camp1.value = "valor 1 " + document.getElementById("campo1").value;
	 document.form.camp2.value = "valor 2 " + document.getElementById("campo2").value;
	 document.form.camp3.value = "valor 3 " + document.getElementById("campo3").value;
	 document.form.tot.value = "total " + document.getElementById("total").value;
	 }
	 </script>
	 
	 ***Html na Página 1***
	 <strong>Valor 1</strong><input name="valor 1" id="valor 1">
	 <p><strong>Valor 2</strong><input name="valor 2" id="valor 2"></p>
	 <p><strong>Valor 3</strong><input name="valor 3" id="valor 3">
	 <button value="Calcular" onClick="calculadora(); novajanela()" type="button">Calcular</button>
	 
	 <input name="campo1" id="campo1">
	 <input name="campo2" id="campo2">
	 <input name="campo3" id="campo3">
	 <input name="total" id="total">
	 
	 ***html da página 2***
	 Resultado da Calculadora
	 <input name="camp1" id="camp1">
	 <input name="camp2" id="camp2">
	 <input name="camp3" id="camp3">
	 <input name="tot" id="tot">

javascript html

  • Kd o function before novajanela()?

1 answer

1


Good evening Bruno. Come on. I corrected your code and commented, I hope it helps!

If you want to test: https://codepen.io/freitas49/pen/QPezgJ

<script>
    function calculadora() {
      var v1 = document.getElementById("valor1").value;
      var v2 = document.getElementById("valor2").value;
      var v3 = document.getElementById("valor3").value;

      document.getElementById("campo1").value += v1/2;
      document.getElementById("campo2").value += v2/3;
      document.getElementById("campo3").value += v3/4;
      document.getElementById("total").value += v1/2 + v2/3 +v3/4;   
    }
    function novajanela() {
      //Pegando os valores dos forms do tipo campo q foram modificados com a calculadora()
      var campo1 = document.getElementById("campo1").value;
      var campo2 = document.getElementById("campo2").value;
      var campo3 = document.getElementById("campo3").value;
      var total = document.getElementById("total").value;

      //Abrir uma nova janela limpa
      myWindow = window.open("");
      //E escrever um pequeno hmtl nela, associando os values dos forms com os respectivos campos calculados anteriormente
      myWindow.document.write("Resultado da Calculadora<br>");
      myWindow.document.write("<strong>Campo 1</strong><br> <input name='camp1' value=" + campo1,"><br>");
      myWindow.document.write("<strong>Campo 2</strong><br> <input name='camp2' value=" + campo2,"><br>");
      myWindow.document.write("<strong>Campo 3</strong><br> <input name='camp3' value=" + campo3,"><br>"); 
      myWindow.document.write("<strong>Total</strong><br> <input name='total' value=" + total,"><br>");
    }
  </script>
</head>
<body>
  <strong>Valor 1</strong><br>
  <input name="valor 1" id="valor1" placeholder="1° Valor"><br>
  <strong>Valor 2</strong><br>
  <input name="valor 2" id="valor2" placeholder="2° Valor"><br>
  <strong>Valor 3</strong><br>
  <input name="valor 3" id="valor3" placeholder="3° Valor"><br>
  <br>
  <button value="Calcular" onClick="calculadora(); novajanela()" type="button">Calcular</button>
  <br><hr><br>
  <strong>Campo 1</strong><br>
  <input name="campo1" id="campo1" disabled><br>

  <strong>Campo 2</strong><br>
  <input name="campo2" id="campo2" disabled><br>

  <strong>Campo 3</strong><br>
  <input name="campo3" id="campo3" disabled><br>

  <strong>Total</strong><br>
  <input name="total" id="total" disabled>

  • Thanks John! Served well. Hug

Browser other questions tagged javascript html

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