Mostrarei aqui como fazer uma validação simples de campos, será verificado se um campo está vázio, ou preenchido com letras ao invés de números. Tudo será feito utilizando apenas HTML e JavaScript ( testado no IE 8 e FireFox 3.6.2). O formulário não será enviado, apesar de estar indicando isto, a intenção é apenas mostrar a validação.
Vamos lá.
1) Todos os arquivos criados neste exemplo deverão estar dentro da mesma pasta. Crie um arquivo novo em qualquer editor de texto e salve como "javascript.js" ou qualquer outro nome desde que tenha a extensão .js (usei o Bloco de Notas);
2) Seu conteúdo será o seguinte. Os caracteres \\ indicam comentário e podem ser apagados caso o usuário deseje.
a) Criando uma função para verificar se um dos campos do formulário esta vazio. Veja o código:
b) Logo abaixo crie a outra função para verificar números foram digitados, veja:
c) Agora, será mostrada uma função um pouco mais complexa que envolve a validação de três parâmetros ao mesmo tempo. Esta função validará uma data separando dia, mes e ano. Veja:
d) Pronto! Nosso arquivo javascript.js está pronto.
3) Agora criaremos um formulário HTLM para testar as funções. Crie um arquivo com o nome vazio.html e salve (este não precisa ter conteúdo algum). Crie outro arquivo novo no editor de texto e salve com qualquer nome desde que tenha a extensão .html (ex.: formulario.html). Segue seu conteúdo:
4)Pronto sua página está pronta. Abra seu arquivo HTML em um navegador. Faça um teste deixando os campos vazios ou preenchendo incorretamente e depois clicando no botão. Deverá ser exibida uma mensagem de erro. Veja a imagem abaixo:
5) Obs.: o intuito deste artigo não enviar o formulário e sim validar por este motivo o formulário não é enviado para lugar nenhum.
Este artigo teve a participação de:
Eliwelton
Escola Estadual Presidente Médici
Curso Técnico em Informática
Fonte: HTML 4.0 Fundamental
Assinar:
Postar comentários (Atom)
Nenhum comentário:
Postar um comentário
Comentar