1

Tenho a seguinte situação:

um formulário e dois botões (submit), sendo que o botão (Cadastrar novo ponto de venda) irá cadastrar os dados no banco de dados e fazer um reload da página de cadastro para que o usuário preencha os dados de um novo ponto de venda, o outro botão (Finalizar o cadastro) irá cadastrar os dados no banco de dados e deverá ser direcionado para a tela de conclusão do cadastro.

O problema é que não consigo fazer com que no momento em que o botão (Finalizar o cadastro) é clicado ele faça o registro dos dados no banco de dados.

Estou desenvolvendo em JavasCript puro e estou começando....

Seguem os códigos:

  <form method="post"> 

    <!-- BOTÕES DE CADASTRO-->
    <div class="button">
      <input type="submit" value="Cadastrar novo ponto de venda" name="send" value="new-register" id="Cadastrar novo ponto de venda" class="new-register" onclick="sendform(this.id)"/>

      <input type="submit" value="Finalizar o cadastro" name="send" value="register" id="Finalizar o cadastro" class="register" onclick="sendform(this.id)" />         
    </div>

  </form>
function sendform(idButton) {
    let form = document.forms[0];
    if (idButton == "Cadastrar novo ponto de venda") {
        form.action = "/register-pdv";
    }
    if (idButton == "Finalizar o cadastro") {
        form.action = "/registered-pdv";
    }
}

Desde já agradeço pela ajuda.

Abs

2
  • 1
    Existe algum motivo para haver 2 input type submit? Por que não usar apenas a tag html button
    – Danizavtz
    Commented 18/07/2020 às 16:51
  • No form, eu preciso de dois botões um para cadastrar apenas uma loja e outro para cadastrar mais lojas. Quando me deparei com o problema eu pesquisei e vi que usavam dois inputs ao invés do button. Como estou começando, pode não ser a melhor opção. Fique à vontade para sugerir, pois estou aprendendo...
    – Newton
    Commented 18/07/2020 às 16:54

1 Resposta 1

1

Tem algumas formas diferentes de resolver seu problema:

Usando HTML5

O atributo formaction faz exatamente que você quer, ele substitiu a ação padrão do form para o botão.

<input type="submit" formaction="/register-pdv">
<input type="submit" formaction="/registered-pdv">

Usando Javascript

Com javascript se precisa criar um evento que quando o usuário clica ele muda a action do form. Para o caso de dois botões a forma mais simples de fazer seria colocar um evento de clique em um dos botões que altera a ação do form:

function changeFormAction() {
    form = document.getElementById("my-form");
    form.action = "/registered-pdv"
}

<form id="my-form" action="/register-pdv">
    <input  type="submit">
    <input onclick="changeFormAction()" type="submit">
</form>
2
  • Obrigado!! As duas formas direcionam para as página que eu quero, contudo quando clico no botão que tem o evento os dados não são registrados no banco de dados. Está tudo funcionando, menos a questão do cadastro dos dados no banco de dados quando clico no botão para finalizar o cadastro.
    – Newton
    Commented 18/07/2020 às 20:23
  • Consegui!!! Não havia criado a rota para gravar os dados no banco de dados quando eu finalizava o registro. MUITO OBRIGADO PELA AJUDA!!!
    – Newton
    Commented 18/07/2020 às 20:38

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .