How do I redirect my form to another page?

Asked

Viewed 373 times

0

Currently my code is opening in a new window the payment page, I would like it to be redirected to another page when click send form depending on the value who is in the option of the second dropbox.

I tried to use the code window.location.href and it didn’t work.

$(function() {		  
  $('#btnget').click(function() {
  let formValido = document
    .getElementById("formulario")
    .checkValidity();

  if (formValido)
    window.open($('#chkveg').val());
  })
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>

<form id="formulario" action="<? $PHP_SELF; ?>" method="POST">
    <select id="eassociado" name="eassociado">
        <option disabled selected value> -- Selecione uma opção -- </option>
        <option>ABRAPP</option>
        <option>ABAAI</option>
        <option>IBGC</option>
        <option>ABRACAM</option>
        <option>ABBC</option>
        <option>Associados Ancord</option>
        <option>Não Associados</option>
    </select>

    <select name="ingresso" id="chkveg">

        <option value="https://pag.ae/7ULKPL7TH">Associados Ancord + C.Dados = R$700,00</option>
        <option value="https://pag.ae/7ULKQ8Zm2">Associados Ancord Normal = R$800,00</option>
        <option value="https://pag.ae/7UTdp8_CG">Associados Entidades Apoiadoras + C.Dados = R$875,00</option>
        <option value="https://pag.ae/7UTdpwWem">Associados Entidades Apoiadoras Normal = R$1.000,00</option>
        <option value="https://pag.ae/7UTdpPZjn">Não Associados + C.Dados = R$1.100,00</option>
        <option value="https://pag.ae/7UTdq2JsG">Não Associados Normal = R$1.250,00</option>
    </select>

    <input name="envia" id="btnget" class="submit-btn" type="submit" value="INSCREVER-SE">
</form>

  • tried window.location.href = "http://..." that way?

  • yes, it won’t, it just gives like a refresh on the page

  • where is the button that submits the form?

  • I forgot to put, put here

2 answers

1

Use preventDefault() to cancel the button action and change the attribute action of the form with the option value before submitting it manually:

$(function() {
   $('#btnget').click(function(e) {
      e.preventDefault();
      let formValido =  document
    .getElementById("formulario")
    .checkValidity();

      if(formValido){
         $("#formulario")
         .attr("action", $('#chkveg').val())
         .submit();
      }
   })
});
  • still opening in a new tab

  • see now.....

  • I put href inves action and nothing happens, the button does not work. I took the preventdefault and sent the email, but it seems that the page reloaded, not changed to any of the values links in options

  • it seems that it blocks the php actions preventdefault and makes the button unusable

  • preventDefault is so that the form is not sent without validating. I tested it here and it worked normally.

  • when I delete php works. php seems to be updating the page after sending the form canceling js

  • here I posted the whole code along with php, the change I only made in the first chosen == 1 (gist.github.com/Lucasmorato/6e6ac480aeebf3ba5f011e93ffadd3c7)

Show 2 more comments

1

Speak up, man, all right? I attached the code to Github to make your life easier (https://github.com/victorhermes/RedirecionarUser/blob/master/index.html). And it follows the gif below the running code. It redirects according to the value of Selection, and on the same page. Ah, detail... I swapped that input of yours (which submits the form) for a button, according to the Github code.

inserir a descrição da imagem aqui

The Javascript code I used was this one below:

<script>      
$(document).ready(function() {

    $(document).on('click', '#btnget', function(e){
        e.preventDefault();

        let formValido = document.getElementById("formulario").checkValidity();

        if (formValido) {
            $(location).attr('href', $('#chkveg').val())
        }

    });

});

I hope I’ve helped!

  • this code worked, if I take e.preventDefault() but the email doesn’t work, I think it stops running php with preventdefault

  • Try to put the button like this (<button id="btnget" class="Submit-btn" type="Submit">Send</button>). If it does not, delete the button and try to input (<input name="send" id="btnget" class="Submit-btn" type="Submit" value="SIGN UP">). But leaves the same Javascript code!

  • it works, only I think my php updates the page and goes back upstairs, interrupting the javascript of directing

  • here I posted the whole code along with php, the change I only made in the first pick == 1 (https://gist.github.com/LucasMorato/6e6ac480aeebf3ba5f011e93ffadd3c7)

Browser other questions tagged

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