Submeter o Formulário Quando o Usuário Pressionar ENTER

Muitas vezes nos deparamos na construção de um formulário em um website. Normalmente, ao preenchermos este formulário e pressionarmos a tecla ENTER, o mesmo é enviado. Mas em alguns casos, onde se modifica ou não se insere um botão de SUBMIT, o efeito da tecla ENTER é removido, não deixando com que o usuário a utilize a tecla.

Em busca de uma solução simples, encontrei o código abaixo que faz com que ao pressionar a tecla enter em um determinado campo, um INPUT por exemplo, o formulário seja submetido. Vejamos como fazer.

Primeiramente, copie este código para dentro da área do seu <HEAD>:

<SCRIPT TYPE=”text/javascript”>
<!–
function submitenter(myfield,e)
{
var keycode;
if (window.event) keycode = window.event.keyCode;
else if (e) keycode = e.which;
else return true;

if (keycode == 13)
{
myfield.form.submit();
return false;
}
else
return true;
}
//–>
</SCRIPT>

Em seguida, adicione em cada campo que desejar o conteúdo em negrito do exemplo abaixo:

<FORM ACTION=”/login”>
Nome:     <INPUT NAME=”nome”><BR>
Senha: <INPUT NAME=”senha” TYPE=”PASSWORD”
onKeyPress=”return submitenter(this,event)”><BR>
<INPUT TYPE=”SUBMIT” VALUE=”Logar”>
</FORM>

Agora o seu campo possui a habilidade de ao se pressionar a tecla ENTER, ele submete o formulário.

Fonte: http://www.htmlcodetutorial.com/forms/index_famsupp_157.html

2 thoughts on “Submeter o Formulário Quando o Usuário Pressionar ENTER

  1. Marcos Douglas
    9 fevereiro 2009 at 11:05 am

    Bom dia,
    Primeiramente obrigado pela função comigo ta funcionando tranquilamente.
    Adicionei um parâmetro que acho que seria util em caso de validação com javascript antes do envio e mudou muita coisa:
    //Só passando o nome a Funcao() javascript de validação , vc pode Colocar o Submit() dentro dessa Funcao(); até +

    function SubmitEnter(myfield,e,Funcao)
    {
    var keycode;
    if (window.event) keycode = window.event.keyCode;

    else if (e) keycode = e.which;

    else return true;

    if (keycode == 13)
    {
    myfield.form.Funcao();
    return false;
    }
    else
    return true;
    }

  2. Marcos Douglas
    9 fevereiro 2009 at 11:07 am

    * NÃO mudou muita coisa xD ~

Deixe uma resposta

O seu endereço de email não será publicado Campos obrigatórios são marcados *