5

Como eu poderia detectar quando um formulário é enviado com Javascript puro? Seria o equivalente a isto em jQuery

$('#form').submit(function(event){
  alert('Meu callback');
  event.preventDefault();
});

Eu estava detectando quando o usuário clica no botão de submit, mas relembrei que ele também pode apertar enter por exemplo.

Será que tenho que detectar as duas ações? No caso, quando o usuário clicar em submit e quando apertar a tecla enter?

É possível conseguir o efeito apenas verificando se o formulário está sendo enviado?

2 Respostas 2

5

$('#form').submit(cb) é um atalho para $('#form').on("submit", cb). Se você quiser evitar o jquery você pode fazer esse bind de eventos usando onsubmit ou o addEventListener.

Para cancelar a submissão da form você pode usar o método preventDefault ou returnar false do event handler:

var meuForm = document.getElementById("meuForm");
meuForm.onsubmit = function(){
    if(dadosInvalidos()){
        return false;
    }
}

(Vale notar que o return false pode não ser atingido se a lógica de verificação lançar uma Exception. Veja essa pergunta no SO em inglês

Finalmente, usando o evento submit como você está fazendo cobre tanto o caso do usuário clicando no botão quanto o caso dele apertando enter.

4

Você pode usar o onsubmit:

<form onsubmit="return minhaFuncao();">

function minhaFuncao()
{
  alert('Minha funcao');
  // Se retornar true deixa a form ser submetida  
  return false;
}

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 .