HTML link to open form without causing page refresh

1

I created a button on a form, but when clicking it refresh the index page where it is and do not want it, I do not want it to refresh the page, just want to open the popup with the form, how do I correct it? >

a href="#" onclick="window.open('form.html', 'Pagina', 'STATUS=NO, TOOLBAR=NO, LOCATION=YES, DIRECTORIES=NO, RESISABLE=YES, SCROLLBARS=YES, TOP=90%, LEFT=280%, WIDTH=485, HEIGHT=545');"><img src='imagens/button-contato.png'></a>

Data from form.html

<!DOCTYPE html>
<html>
<head lang="PT-BR">
    <meta charset="UTF-8">
    <title>Formulário de Contato</title>
</head>
<body>
<!-- Do not change the code! -->
<a id="foxyform_embed_link_181315" href="http://br.foxyform.com/">foxyform</a>
<script type="text/javascript">
    (function(d, t){
        var g = d.createElement(t),
                s = d.getElementsByTagName(t)[0];
        g.src = "http://br.foxyform.com/js.php?id=181315&sec_hash=e727220c0f2&width=445px&heigth=525px";
        s.parentNode.insertBefore(g, s);
    }(document, "script"));
</script>
<!-- Do not change the code! -->
</body>
</html>
    
asked by anonymous 05.09.2017 / 16:37

3 answers

0

Change href to javascript:void(0) :

<a href="javascript:void(0)" onclick="window.open('form.html', 'Pagina', 'STATUS=NO, TOOLBAR=NO, LOCATION=YES, DIRECTORIES=NO, RESISABLE=YES, SCROLLBARS=YES, TOP=90%, LEFT=280%, WIDTH=485, HEIGHT=545');"><img src='imagens/button-contato.png'></a>
    
05.09.2017 / 17:11
0

When you trigger an element, the browser assumes that you want to move to a new address. As you've assigned "#" to the element's href, it loads the page again, adding "#" to the end of the url.

You will need to run the script like this:

    
05.09.2017 / 17:00
0

I had to change the part of the script that was not taking the data from the form, but the script that generates the form. Then follow the changes that worked.

Change the tag to not call another page, rather the function:

<a id="foxyform_embed_link_181315" href="#" onClick="abrirForm(document)">foxyform</a>

change the script part to name the function:

    <script type="text/javascript">

    function abrirForm(d){
           var l = d.getElementById("foxyform_embed_link_181315");
      i = d.createElement('IFRAME');
  i.src = "http://br.foxyform.com/form.php?id=181315&sec_hash=e727220c0f2";
  i.width = "445px";
  i.height = "524px";
  i.frameborder = 0;
  i.setAttribute('style', 'border: none;');
  i.setAttribute('frameborder', '0');
  l.setAttribute('style', 'display: block; width: 445px; font-size: 0.7em; color: grey; text-align: right; text-decoration: none;');
  l.parentNode.insertBefore(i,l);
}(document);

</script >

Uploaded form

    
05.09.2017 / 16:58