Segue o exemplo:
Exemplo de uso:
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
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
| </pre><!DOCTYPE html><html> <head> <title>Validate Plugin</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <script src="js/jquery.min.js" type="text/javascript"></script> <script src="js/jquery.validate.js" type="text/javascript"></script> <link href="css/validate.css" type="text/css" media="screen" rel="stylesheet" /> <!--[if lte IE 7]> <link href="css/validate_ie7.css" type="text/css" media="screen" rel="stylesheet" /> <![endif]--> </head> <body> <div id="wrap"><form id="f1" class="validate" action="" method="post" > <p> <label>Combo:</label> <select name="combo" id="combo" class="required"> <option value="">Selecione um item na lista</option> <option value="0">AA</option> <option value="1">BB</option> </select> <span>Selecione um item</span> </p><p> <label>Nome:</label> <input type="text" name="nome" id="nome" class="required" minlength="5" /> <span>Informe seu nome completo</span> </p><p> <label>Telefone:</label> <input type="text" name="fone" id="fone" class="required fone" /> <span>Informe seu telefone com DDD</span> </p> <p> <label>Obrigatório - Mínimo 5 letras:</label> <input type="text" name="str" id="str" class="required" minlength="5" /> <span>Campo requerido, informe ao menos 5 letras</span> </p><p> <label>Data:</label> <input type="text" name="data" id="data" class="required data" maxlength="10" /> <span>Campo requerido, informe uma data válida</span> </p><p> <label>CPF:</label> <input type="text" name="cpf" id="cpf" class="required cpf" /> <span>Campo requerido, informe um CPF válido</span> </p> <p> <label>CNPJ:</label> <input type="text" name="cnpj" id="cnpj" class="required cnpj" /> <span>Campo requerido, informe um CNPJ válido</span> </p> <p> <label>Numérico Mínimo 5 caracteres:</label> <input type="text" name="num" id="num" class="required numeric" minlength="5" maxlength="10" /> <span>Campo requerido, apenas números</span> </p><p> <label>Email:</label> <input type="text" name="email" id="email" class="required email" /> <span>Campo requerido, informe um e-mail válido</span> </p><p> <label>Senha - Mínimmo 4 caracteres</label> <input type="password" name="password" id="password" class="required password" minlength="4" /> <span>Campo requerido, informe ao menos 4 caracteres</span> </p><p> <label>Repetir Senha </label> <input type="password" name="rpassword" id="rpassword" class="required password" minlength="4" /> <span>Repita a senha</span> </p> <p> <button class="button blue submit">Enviar</button> <button class="button gray reset">Limpar</button> </p></form> </div> </body></html><pre> |
As instruções estão no arquivo leia-me.txt
O plugin pode ser customizado de acordo com suas necessidades, as mensagens de validação podem ser alteradas no arquivo.
fonte : http://blog.clares.com.br/validacao-de-formularios-com-jquery-plugin-atualizado/
Nenhum comentário:
Postar um comentário