Detectando ENTER
Livros publicado pelo autor:
Livros publicados.
Olá pessoal meu nome é Mauricio Junior, estou disposto a mostrar uma forma legal, simples e rápida de como detectar o botão ENTER em um campo text quando acionado pelo usuário.
Requisitos:
- Visual Studio.NET 2005;
- Projeto do tipo ASP.NET;
- Linguagem C#.NET
- Linguagem de interpretação JAVA SCRIPT
- Framework 2.0
O primeiro passo para que funcione corretamente foi desenvolver uma function em JavaScript para que detectasse o ENTER quando clicado pelo usuário. Percebi que no JavaScript, existe um evento chamado “event.keyCode” que pega o número da tecla clicada.
Dessa forma, fiz a function. (Referência 1.1)
// Para usar voce passa a tecla e o nome do form // exemplo: onkeypress(event.keyCode, 'nome do seu form') // autor: Mauricio Junior function f_bEnter(vTecla, sNoForm){ // Executa Enter no Form. if (vTecla == 13){ //avisa o enter alert("ENTER BLOQUEADO!"); } } |
Referência: 1.1
Veja que dentro da function, pergunto se a tecla clicada é igual a 13, caso for mostra um alert para o usuário.
O próximo passo foi criar um arquivo .js dentro do projeto. Cliquei com o botão direito em cima do projeto, adicionar um novo item e na tela de template cliquei no arquivo .js. (Referência 1.2)
Referência: 1.2
O nome do arquivo é JScript.js. Em seguida, coloquei a function criada dentro do arquivo, sem as tags <script>. (Referência 1.3)
Referência: 1.3
Na página default.aspx adicionei um novo controle do toolbox chamado texbox. Posso arrastar e colar no modo designer ou apenas digitar dentro do modo HTML. (Referência 1.4)
<form id="form1" runat="server"> <div> <asp:TextBox ID="txtEnter" runat="server"></asp:TextBox> </div> </form> |
Referência: 1.4
Dentro da tag div digitei o meu textbox com o nome txtEnter e fechei a tag. No topo da página, adicionei o script criado anteriormente da referência 1.1. (Referência 1.5)
<head runat="server"> <title>Projeto ENTER</title> <script type="text/javascript" src="JScript.js"></script> </head> |
Referência: 1.6
Note que foi adicionado dentro do <head> da página o script JScript.js. Depois disso, cliquei duas vezes na página default.aspx para acessar o código default.aspx.cs. O objetivo agora é adicionar via código a function dentro do textbox. (Referência 1.7)
txtEnter.Attributes.Add("onkeyPress", "f_bEnter(event.keyCode,'form1');"); |
Referência: 1.7
Adicionei um atributo com o evento onkeyPress passando o nome da function criada, o evento de keyCode e o nome do form da página. Falta agora iniciar o projeto e ver se funcionará. (Referência 1.8)
Referência: 1.8
Digitei uma palavra e acionei o ENTER do teclado, veja o que foi mostrado. (Referência 1.9)
Referência: 1.9
Bom, esse foi o objetivo; mostrar como pegar a tecla ENTER do teclado caso o usuário clique dentro de um campo. Além de mostrar um alerta, pode ser feito outras coisas como submeter o form e tudo mais.
Espero ter ajudado, qualquer dúvida favor entrar em contato pelo e-mail mauricio@aspneti.com.
Mauricio Junior
www.aspneti.com.
Sign up to our newsletter
Receive our latest updates about programming languages, software, database, books, ebooks, classes, jobs and more.