01 Apr
Posted by: wilker in: Internet Explorer, JavaScript
Bom como eu havia prometido, mas tinha sumido novamente. então resolvi cumprir com a minha palavra e postar essa classe em js para validação de dados em JavaScript, a classe é muito simples de se utilizar e de se adicionar novas propriedades, então se alguem quiser melhorar ela fique a vontade.
Bom acredito que todo mundo saiba que o JavaScript ao contrário do PHP que faz sua verificação e validação no servidor o Javascript faz no próprio browser do cliente, sendo muito mais prático você fazer validações dos campos do seu formulário em JavaScript pois o mesmo já processa toda a informação ali no cliente mesmo e já informa se há algum campo com uma validação requerida que não está batendo as informações.
Então vamos ao que interessa, vou explicar passo a passo aqui como funciona a classe.
Primeiro vamos instanciar a classe na pagina aonde está nosso formulário para fazer a validação, vamos a configuração.
forms = new form();
// Configurações
// Cor do Highligth , true ou false , box ou alert , se for box coloca o id da div
forms.settings("#F7D4D4",true,"box","windowErros");
nas configurações acima determinamos que:
1 - Qual a cor será do campo quando o mesmo não for validado corretamente
2 - Se o modo de debugação está ou não ativado (caso esteja false o form não funcionará e irá ligar o debug, se for true ele vai tentar fazer a validação)
3 - Qual o tipo de exibição (”alert” ou “box”)
4 - Se for “box” devemos informar qual será a div que será exibido as informações para o usúario.
Vamos configurar agora os campos para que a validação funcione no campo.
input title="Nome - Preencha o nome" size="63" name="nome" class="valida-nulo" type="text"
Bom a utilização da classe é muito simples, você precisa definir nos seus campos um titulo (propriedade title=”alguma coisa”) que é a mensagem que será exibida tanto dentro do alert, quanto dentro do box. você que vai escolher.
é interessante a utilização desta classe pela flexibilidade das informações da mesma, ou seja… você tem regras e cada regra tem sua propriedade e método. as regras são adicionadas na class do campo. abaixo segue uma lista de regras que já veem por padrão na classe, e fique a vontade se quiser criar mais regras.
Regras -> Descrição :
valida-nulo -> valida se um campo está em branco e retorna a mensagem que está no title.
valida-email -> valida se o email informado está correto.
valida-data -> valida se a data informada está preenchida corretamente. (ex: 10/01/2008)
valida-numero -> valida se o dado informado no campo é apenas numero. (ex: 1234567890)
valida-moeda -> valida se o dado passado no campo é um valor em dinheiro. (ex: 10,50)
valida-url -> valida se o dado passado no campo é mesmo uma url (ex: http://www.misgood.com)
valida-cpf -> valida se o cpf informado no campo está correto.
valida-cnpj -> valida se o cnpj informado no campo está correto.
Vamos agora da uma olhada em como que nós criaríamos uma função para que possamos validar vários tipos de campos quando nosso formulário for enviado.
function enviarFormulario() {
if (forms.camposNulos("misgood","text|select-one|textarea|hidden","0")) {
return true;
} else {
return false;
}
}
Não se desespere, é tudo muito simples! hehehehehehe vamos lá.
Na primeira propriedade informamos a identificação do formulario… ou seja o id do form
Na segunda propriedade informamos quais tipos de campos que nós iremos validar, você pode identifica-los através do id do campo também.
Na terceira informamos quais campos ou tipo de campo não queremos que valide. se nenhum é pra validar pode deixar “0″.bom acho que é isso, desculpa ae fazer um tutorial fraquinho que nem esse mais tentei explicar ao máximo sobre o funcionamento da minha classe… e em breve eu coloco mais classes.alguma duvida só é mandar e-mail para wilker@misgood.com .
valeu abaixo está a classe para vocês baixarem.
| M | T | W | T | F | S | S |
|---|---|---|---|---|---|---|
| « Nov | ||||||
| 1 | 2 | 3 | 4 | |||
| 5 | 6 | 7 | 8 | 9 | 10 | 11 |
| 12 | 13 | 14 | 15 | 16 | 17 | 18 |
| 19 | 20 | 21 | 22 | 23 | 24 | 25 |
| 26 | 27 | 28 | 29 | 30 | 31 | |
2 Responses
Leandro Miranda
07|Jun|2008 1Amigo,
Estou aprendendo a programar e não estou conseguindo fazer meu formulario usar a sua classe javascript pra validar o campo email por exemplo. No form eu tenho que configurar alguma coisa, no campo email tambem tenho que fazer algo?
wilker
07|Jun|2008 2no campo email nao, mais no cabecalho do seu form… sabe
Leave a reply
Voce precisa estar Cadastrado para postar um comentário.