Open Poup-Up - Help

Question

I have the following HTML, but all on the same page id entree is where it takes my input field from the address typed arrival is where he gets his final address outworking is the calculation:

    <div id="entrada"></div>
    <div id="chegada"></div>
    <div id="Resultado"></div>

<input type="submit" class="btn-green" id="btnCalcular" onclick="calcular();" value="Calcular" />

I have this Function to calculate my input text:

<script language= "javascript">
function calcular(){
            var litros = parseFloat(document.getElementById('txtKM').value) / parseFloat(document.getElementById('txtKML').value);
            var valor = parseFloat(document.getElementById('txtPL').value) * litros;
            document.getElementById('Resultado').innerHTML = "<br><b>Gasto total: R$ </b>" + valor;
            var txtentrada = document.getElementById('txtEnderecoPartida').value;
            document.getElementById('entrada').innerHTML = "<br><b>Endereço de Partida:</b><br>" + txtentrada;
            var txtchegada = document.getElementById('txtEnderecoChegada').value;
            document.getElementById('chegada').innerHTML = "<br><b>Endereço de Chegada:</b><br>" + txtchegada;
        }
</script>

Now, what I’d like to know is: How do I stop at the time of clicking the button it can open on another page (Poup-up), already tried with windows.open but does not open, since my onclick is calling this function on the same page to calculate.

EDIT: I have this HTML:

<a href="index.php" onclick="window.open('index.php', 'Pagina', 'STATUS=NO, TOOLBAR=NO, LOCATION=NO, DIRECTORIES=NO, RESISABLE=NO, SCROLLBARS=YES, TOP=10, LEFT=10, WIDTH=900, HEIGHT=500');">

I wanted to pull the information from outworking to a new page;

Answer 1

You can send the value to the new window popup via POST, creating a form dynamic.

Link to open the popup:

<a href="javascript:void(0)" onclick="novaJanela()">Abrir janela</a>

Function:

function novaJanela(){

   // seleciono o form para ver se ele existe
   var popupform = document.body.querySelector("#popupform");

   // se ele existe, excluo do DOM
   if(popupform) popupform.outerHTML = '';

   // pego o texto na div #Resultado
   var res = document.getElementById("Resultado").textContent;

   var f = document.createElement("form"); // crio o form
   f.method = "post"; // adiciono método post
   f.target = "Pagina"; // defino o alvo para a popup
   f.action = "index.php"; // defino o action para o index.php da popup
   f.id = "popupform"; // defino uma id ao form
   f.style.cssText = "display: none;"; // escondo o form para que funcione em background

   var i = document.createElement("input"); // crio o input do form que levará o valor
   i.value = res; // adiciono o valor ao input
   i.name = "resultado"; // dou um nome ao input que será capturado pelo PHP
   f.appendChild(i); // adiciono o input ao form

   document.body.appendChild(f); // adiciono o form ao DOM

   // abro a popup
   window.open('index.php', 'Pagina', 'STATUS=NO, TOOLBAR=NO, LOCATION=NO, DIRECTORIES=NO, RESISABLE=NO, SCROLLBARS=YES, TOP=10, LEFT=10, WIDTH=900, HEIGHT=500');

   f.submit(); // submeto o form à popup
}

In the popup index.php you take the value using POST:

<?php
$resultado = $_POST['resultado'];
?>

Answer 2

You can do the following: put in href of the link <a>:

href="javascript:void(0)"

This will prevent redirect action of the link. And put in the onclick a function to open a new window:

onclick="novaJanela()"

The <a> will look like this:

<a href="javascript:void(0)" onclick="novaJanela()">Abrir janela</a>

Done this, add function novaJanela() in the script:

function novaJanela(){

   var res = document.getElementById("Resultado").innerHTML;

   window.open('index.php?resultado='+res, 'Pagina', 'STATUS=NO, TOOLBAR=NO, LOCATION=NO, DIRECTORIES=NO, RESISABLE=NO, SCROLLBARS=YES, TOP=10, LEFT=10, WIDTH=900, HEIGHT=500');

}

The variable var res will store the contents of div Resultado and send as parameter "outworking" to the popup:

window.open('index.php?resultado='+res,...

In the popup index.php you take the value using GET:

<?php
$resultado = $_GET['resultado'];
?>

This way of opening the popup will not be browser blocked because was the result of user interaction through one click.