Validação simples e eficiente usando jQuery
Quem nunca precisou criar um script de validação de formulário, e algumas vezes ter que criar do zero ou quando procura por um pronto, nem sempre encontra um excelente script, ou até mesmo para adaptar para o formulário, precisa mexer quase em todos os códigos.
Mas trago um script usando jQuery, que não irá dar muito trabalho de adaptar para o formulário e poder usar o script de uma maneira muito simples.
Para baixar a classe usada pode ser baixada nesse link: http://jqueryvalidation.org/
E pode ver um exemplo em funcionamento aqui.
Usando a classe de uma maneira simples.
[sourcecode language=”html”]<form class="cmxform" id="commentForm" method="get" action="">
<fieldset>
<legend>Please provide your name, email address (won’t be published) and a comment</legend>
<p>
<label for="cname">Name (required, at least 2 characters)</label>
<input id="cname" name="name" minlength="2" type="text" required>
</p>
<p>
<label for="cemail">E-Mail (required)</label>
<input id="cemail" type="email" name="email" required>
</p>
<p>
<label for="curl">URL (optional)</label>
<input id="curl" type="url" name="url">
</p>
<p>
<label for="ccomment">Your comment (required)</label>
<textarea id="ccomment" name="comment" required></textarea>
</p>
<p>
<input class="submit" type="submit" value="Submit">
</p>
</fieldset>
</form>
<script>
$("#commentForm").validate();
</script>[/sourcecode]
Documentação
You’re probably looking for
Opções para o validate() methodos
Durante toda a documentação, dois termos são usados com muita freqüência, por isso é importante que você saiba o seu significado no contexto do plugin de validação:
- method: Um método de validação implementa a lógica para validar um elemento, como um método de e-mail que verifica o formato certo do valor de um input. Um conjunto de métodos padrão está disponível, e é fácil de escrever o seu próprio.
- rule: A regra de validação associa um elemento com um método de validação, como “validar o campo com o nome” primário-mail “com métodos” necessária “e” email “.
Plugin metodos
Esta biblioteca adiciona três métodos plugin jQuery, o principal ponto de entrada de ser o método de validação:
validate()
– Valida o formulário selecionado.valid()
– Verifica se os campos selecionados são válidos.rules()
– Le, adiciona e remove regra para o elementos.
Elementos personalizados
Esta biblioteca também se estende jQuery com três seletores personalizados:
:blank
– Seleciona todos os campos com o valor em branco.:filled
– Seleciona todos os campos que estão preenchidos.:unchecked
– Seleciona todos os campos que não foram selecionados.
Validação
O método de validação retorna um objeto de validador que tem alguns métodos públicos que podem ser usados para acionar a validação programática ou alterar o conteúdo do formulário. O objeto de validador tem mais métodos, mas somente aqueles documentado aqui são destinados para uso.
Validator.form()
– Valida o formulário.Validator.element()
– Valida um campo.Validator.resetForm()
– Reseta todo o formulário.Validator.showErrors()
– Mostra uma mensagem especifica.Validator.numberOfInvalids()
– Retorna o número que está invalido.
Existem alguns métodos estáticos no objeto de validador:
jQuery.validator.addMethod()
– Adiciona um metodo personalizado.jQuery.validator.format()
– Substitui placeholders com argumentos.jQuery.validator.setDefaults()
– Modifica o default configurado para validação.jQuery.validator.addClassRules()
–Adicionar um método de classe composto.
Lista de métodos de validação embutidos
Um conjunto de métodos de validação padrão é fornecido:
required
– Marca os elementos que é obrigatórios.remote
– Solicita um recurso para verificar o elemento de validade.minlength
– Faz com que o elemento de exigir um determinado comprimento mínimo.maxlength
– Faz com que o elemento de exigir um determinado comprimento maxmimum.rangelength
– Faz com que o elemento exigem um determinado intervalo de valores.min
– Faz com que o elemento de exigir um determinado mínimo.max
– Faz com que o elemento de exigir um determinado máximo.range
– Faz com que o elemento exigem um determinado intervalo de valores.email
– Torna o elemento requerem um email válidourl
– Torna o elemento exigir uma url válidadate
– Faz com que o elemento exigem uma data.dateISO
– Faz com que o elemento exigem uma data ISO.number
– Faz com que o elemento necessita de um número decimal.digits
– Faz com que o elemento exigem apenas dígitos.creditcard
– Faz com que o elemento de requerer um número de cartão de crédito.equalTo
– Requer o elemento a ser o mesmo que outro
Mais alguns métodos são fornecidos como add-ons, e estão incluídas no methods.js adicional no pacote de download. Nem todos eles são documentados aqui:
accept
– Faz um upload do arquivo aceitar mime-types só especificados.extension
– Faz com que o elemento exigem uma certa extensão de arquivo.phoneUS
– Validar para o número de telefone válido EUA.require_from_group
– Garante um determinado número de campos em um grupo estiverem concluídas.
Fonte: http://jqueryvalidation.org/documentation/
Abraço a todos =)