Jquery Validation Campo único (login, email,etc…)

Após um bom tempo sem postar, estou de volta.

Dessa vez eu vou falar um pouco sobre o jQuery Valitation um plugin do jQuery para validação de campos.
Vou abordar sobre uma validação remota que está presente nesse plugin e é muito útil para validar campos únicos em formulário.

Por exemplo, no seu site, você tem um formulário de cadastro que tem os campos login e senha, mas o campo de login deve ser único e você quer fazer essa validação usando o plugin Validation.

1º passo: Incluir o jQuery e o plugin Validation ao seu html:
[html]<!– Inclusão do Jquery –>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js" type="text/javascript"><!–mce:0–></script>
<!– Inclusão do Jquery Validate –>
<script src="http://ajax.microsoft.com/ajax/jquery.validate/1.6/jquery.validate.js" type="text/javascript"><!–mce:1–></script>[/html]
2º passo: Criar o formulário:
[html]<form id="meu_form" method="post">
Login:
<input id="login" name="login" type="text" />
Senha:
<input id="senha" name="senha" type="password" />
<input type="submit" value="Cadastrar" />
</form>
[/html]
3º passo: Fazer a validação
[js]<!– Validação do forumlário –>
$(document).ready(function(){
$(‘#meu_form’).validate({
rules:{
login:{ required: true, remote: ‘verifica.php’ }
},
messages:{
login:{ required: ‘Este Campo é obrigatorio’ , remote: ‘Este Login já está em uso.’}
}

});
});[/js]
Repare que o campo ‘login’ tem a validação ‘required’ (campo obrigatório) e a validação ‘remote’ (remota), sendo assim quando o usuário acaba de digitar o login ele vai no servidor e passa esse valor via GET

Pelo firebug podemos observar a requisição sendo feita ao servidor:

Como no validate colocamos remote: ‘verifica.php’ , é enviado o parametro login (nome do campo) e o valor digitado.
No arquivo verifica.php, recebemos esse valor com o $_GET[‘login’] , fazemos a consulta no banco e então
[php]//Se o login já existir você exibe false
echo ‘false’;
//Se o login não existir
echo ‘true’;[/php]
pois essa verificação retorna ao validate se o campo é válido ou não.

Veja o Demo.

Faça o download dos arquivos.

Espero que tenham gostado.
Obrigado pela visita.

Dê sua nota: [ratings]