+2

Validando formulários com o Tigra

criado por Fred Hakamine em 14/10/2005 7:13pm
Agora devemos inserir os códigos para o validator.js saber o que validar e como validar. A idéia agora é prestar muita atenção, porque é aqui que poderão ocorrer as maiores dores de cabeça em caso de erro.

Os códigos das configurações deverão estar após o formulário ser fechado em qualquer local, mas recomendo que isto esteja após o final do body </body>.

Este é o código que eu fiz:
</body>
<script language="javascript" type="text/javascript">
var campos= {
'nome':{'l':'Primeiro nome','r':true,'f':'alpha','t':'nome'},
'email':{'l':'E-mail','r':true,'f':'email','t':'mail'}
}
var v = new validator('formulario1',campos);
</script>
</html>

Agora vou explicar passo a passo o código...

1° - Abri o javascript:
<script language="javascript" type="text/javascript">

2° - Logo após estou configurando quais campos devem ser validados e como isto deve ser feito dentro da var campos:
var campos= {
'nome':{'l':'Nome','r':true,'f':'alpha','t':'nome'},
'email':{'l':'E-mail','r':true,'f':'email','t':'mail'}
},

Notem a sintaxe para você adaptar no seu cógido certinho:

'nome_do_campo':{'l':'Nome do campo para erros','r':true,'f':'tipo do campo','t':'onde vai apontar em caso de erro'},

r: indica se o campo é obrigatório ou não (true ou false)
f: possui os tipos de campo:
alpha = letras, pontos e hífens
alphanum = letras, números e underline (_)
unsigned = um número positivo
integer = um número inteiro
real = um número com ponto decimal
email = formato de e-mail
phone = Número de telefone com digitos, espaços, pontos e hífens
date = data no formtado DD-MM-YYYY
time = tempo no formato HH:MM:SS

Após inserir todos os campos que você deseja validar, simplesmente rode e veja o resultado... na próxima página estou passando uma dica legal pra quem utiliza os CSS.

Comentários:

Mostrando 1 - 10 de 58 comentários
Bom Dia para todos!
Muito bom este artigo.
Parabens ao autor pela capacidade de sintese e o metodo pedagogico usado p explicar.
Tudo muito claro. Segui o tutorial e obtive 100% de resultado positivo.
Parabens!
11/05/2010 4:19am (~10 anos atrás)

Estou aprendendo PHP e fiquei com duvidas como coloco isto em meu programa tenho dois programas um onde uso o echo para montar o meu formulário é a onde (edito, altero, listo e excluo) e outro onde tenho o meu cabeçalho e rodapé.
Onde coloco as linhas:
<script language='javascript' src='./validator.js' type='text/javascript'></script>

onsubmit="return v.exec()"

</body>
<script language="javascript" type="text/javascript">
var campos= {
'nome':{'l':'Primeiro nome','r':true,'f':'alpha','t':'nome'},
'email':{'l':'E-mail','r':true,'f':'email','t':'mail'}
}
var v = new validator('formulario1',campos);
</script>
</html>
01/06/2009 12:43pm (~11 anos atrás)

Galera, segui a ideia dos colegas aqui, e consegui usar a validação perfeitamente,

Agora estou precisando colocar o TIGRA pra validar 2 forumularios na mesma pagina.

Algum colega ja precisou disso.

Grato por qualquer informação,

Rodrigo
17/06/2007 1:08pm (~13 anos atrás)

Pessoal, descupem a falta de atenção, pois o exemplo cita já é bem didatico.

Tenho ainda algumas dúvidas quanto a perda das máscaras de entrada quando adapto ao tigra, por exemplo de data.

...
<input name="base_precos" type="text" align="right" id="base_precos" size="20" maxlenght=20 value="" onKeyDown="javascript:return dFilter (event.keyCode, this, '##/##/####');" style="font-family:verdana;font-size:10pt;width:110px;">
...
Podem me auxiliar, por favor?
Obrigado.
07/07/2006 5:03am (~14 anos atrás)

Caros colegas,

Poderiam exemplificar de forma mais didática, com uma página php completa de como validar com máscaras 3 campos diferentes de data, nome e valor?

Obrigado.
03/07/2006 12:19pm (~14 anos atrás)

cobrinha disse:
Estou usando uma combo com o campo alfa, mais preciso a liberação de acentos e espaços, como faço?
30/03/2006 8:56am (~14 anos atrás)

Marcio disse:
Muito bom esse artigo, porem, não consegui validar o script pelo método GET? Há algum segredo?
01/03/2006 4:35am (~14 anos atrás)

// substitua a variável por isto aqui
var re_dt = /^(\d{1,2})\/(\d{1,2})\/(\d{4})$/

// substitua a data por isto aqui
'date' : function (s_date) {
// check format
if (!re_dt.test(s_date)){
return false;
}
// check allowed ranges
if (RegExp.$1 > 31 || RegExp.$2 > 12){
return false;
}
// check number of day in month
var dt_test = new Date(RegExp.$3, Number(RegExp.$2-1), RegExp.$1);
if (dt_test.getMonth() != Number(RegExp.$2-1))
return false;
return true;
},
15/02/2006 2:52am (~15 anos atrás)

Luciano Tadeu disse:
Gente....perdão a minha ignorância, mas não entendi algumas coisas...
Qual é o tipo do campo para texto , por exemplo nome (com espaços e acentos)?
E outra coisa...tem como alguém explicar melhor a sintaxe do código....

var campos= {
'nome':{'l':'Nome','r':true,'f':'alpha','t':'nomes'},
'email':{'l':'E-mail','r':true,'f':'email','t':'mail'}
}

Thanks!
24/01/2006 7:59am (~15 anos atrás)

Alexandre disse:
Alguém já pensou em criar validação de tag html, neste sisteminha bacana de validação?....
Tenho um bom editor de conteúdo em javascript para campos de Texto parecido com Word, onde o usuário faz uso de tags html pra postar os textos só que as tags vão embutidas no código e o usuário não as vê, estou tentando incrementar mais essa funcionalidade a validação...por enquanto não funfou.

Abraço
18/01/2006 3:21pm (~15 anos atrás)

Novo Comentário:

(Você pode usar tags como <b>, <i> ou <code>. URLs serão convertidas para links automaticamente.)