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 =)