Parece óbvio, não? Mas infelizmente não é tão óbvio quanto parece. Muitos sites por aí estão regredindo vários passos na escala evolutiva da web e criando formulários que só submetem com um clique do mouse em um botão ou um ENTER quando o mesmo botão tem o foco.

Esse tipo de problema é devido, praticamente sempre, ao desejo de fazer alguma coisa “legal” com o formulário, sempre usando JavaScript e AJAX.

E a solução é tão simples: coloque um botão de submissão comum em seus formulários.

Exemplos comuns desse tipo de formulário são campos de busca e formulários onde você deve entrar apenas seu email, por exemplo, para se inscrever em algum tipo de serviço.

Nesse tipo de formulário, o comportamento padrão do usuário é digitar e apertar ENTER. Veja como é fácil fazer isso funcionar:

<input type="text" name="email" size="50">
<input type="submit" value="Enviar">

Simples assim. A não ser que o campo onde os dados devem ser digitados seja uma TEXTAREA, um ENTER dentro do campo de texto vai submeter o formulário, enviar os dados para o servidor e, com sorte, trazer uma resposta para o usuário.

Se você quiser fazer algo bonito, com AJAX e tudo mais, faça em outra camada. Na camada de comportamento. Já falei sobre isso aqui em alguns posts então não vale a pena gastar espaço falando de novo.

A moral da história é: não torne o que é simples complicado. Até porque acaba sendo mais complicado pra você também.


Leia também:

13 Comentários sobre “Crie formulários que submetam com um ENTER”

  1. Yalli Oliveira disse:

    É… ultimamente tenho vistos muitos sites com formulários em que o butão enter não funciona após o formulário ser completado… fazendo com que o usuário tenha o trabalho de tirar a mão do teclado. Pode parecer besteira, mas para mim, isso é um saco…

  2. MARCOS disse:

    Por favor,

    preciso de ajuda para criar um formulário, como este que estou preenchendo para colocar num site que, de modo amador, estou desenvolvendo.

    Gostaria muito de saber como criar esses formularios e submete-los da melhor forma possivel.

    Se puder me jaudar, desde ja agradeço,

    Atenciosmente,

    Marcos

    Obs.: Parabens pela página. Um dia chego lá.

  3. Lourenço Rizzotto disse:

    Eu descordo da importancia de utilizar ENTER para submeter formulários.Como foi dito a cima na TEXTAREA o ENTER não irá submeter o formulário, e se pensarmos bem o último campo que o usuário prenche é a TEXTAREA.

  4. Pereira disse:

    Teste de formulario

  5. Fernando Bernardes disse:

    //é da um trampo pra fazer isso… mais é so funfa esse código ae… ele chega se o botao pressionado dentro das text’s for igual a enter… se for ele submete o formulario ;) faroww galera ? facil d+ né ?
    function apertaenter () {

    var keynum;

    if (window.event) keynum = window.event.keyCode;

    else if (e.keyCode) keynum = e.wich;

    if (keynum == 13) document.getElementById(‘iddoformulario’).submit();
    }

    //nos campos tipo text vc poem
    //Nao esquece de por

  6. Fernando Bernardes disse:

    falto uma ciosa… tem q por o onkeypressed nas input…

  7. Anselmo Battisti disse:

    Outro problema na questão do ENTER para enviar os formulário são os campos SELECT. Se este tipo de campo for o último do seu formulário ai não tem o que fazer tem que dar o TAB pq qualquer outra abordagem, por exemplo, quando o usuário clicar no select mandar o foco automaticamente para o botão submit acaba provocando outros problemas de usabilidade

  8. Thiago disse:

    Faz isso funcionar no Internet Explorer

  9. Jose disse:

    É fácil assim é? Então já que você acha tudo tão fácil, entre por gentileza nesse site e descubra porque o formulário não segue para o email do destinatário. Ah, e por favor não diga que o provedor não dá suporte porque ele dá sim. Encontre outra desculpa.

  10. Francisco Marcantel disse:

    Freakin nice blog .. looking forward to further posts.

  11. car rims disse:

    ghost ride that whip

  12. Bruno disse:

    Cara,

    A maioria das pessoas que caem nessa página deve estar, obviamente, como eu, procurando uma solução para submeter um form sem colocar um botão submit.
    Já coloquei ele com display:none, mas, alguns navegadores ainda assim o ignoram e não submetem o form ao apertar enter.

  13. mister obvio disse:

    Ainda procuro a solução pra submeter apertando somente o enter

    att, Mister Óbvio

Leave a Reply