Publicado em 31 de jan.

Valida Cadastro (AJAX)

Atendendo a pedidos, criei um sistema que valida se o usuario esta cadastrado antes mesmo de acabar de concluir o cadastro

é semelhante o sistema do forum ,se vcs tentarem se cadastrar com um nome de usuario que ja existe aparecera uma mensagem quando o campo nome perder o foco

bom o sistema é muito simples nao tem segredo, e nao fiquei perdendo tempo enfeitando o codigo com css nem nada o foco aqui é o ajax e mostrar que ele retorna true ou false depois de digitar o nome de usuario

cadastro.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1257" />
<title>Login</title>
<style>

<!--
html, body {

margin:0;
padding:0;
}

fieldset {

width:260px;
margin:0 auto;
padding:30px;
}

.texto {
width:250px;
border:1px solid gray;
}

.erro {
width:250px;
border:1px solid red;
}

.alerta2 {
border:1px solid gray;
}

-->

</style>
<script src="ajax.js" type="text/javascript"></script>
<script src="funcoes.js" type="text/javascript"></script>
</head>

<body>
<fieldset>
<legend>Usuario</legend>
	<form id="form1" name="form1" method="post" action="login.php">
 <div id="alerta"></div>
 <label>Login</label><br />
 <input name="login" id="login" type="text" maxlength="30" class="texto" onblur="java script: envia('receber.php', 'POST', false);" /><br />
 <labeL>Senha</labeL><br />
 <input name="senha" id="senha" type="password" maxlength="30" class="texto" /><br />
 <input name="botao" type="submit" value="Enviar" />

</form>
</fieldset>
</body>
</html>

ajax.js:

function ajax() {
};
ajax.prototype.iniciar = function() {

try{
this.xmlhttp = new XMLHttpRequest();
}catch(ee){
try{

 this.xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
	}catch(e){
 try{
 this.xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
 }catch(E){
 this.xmlhttp = false;
 }
	}
}
return true;
}

ajax.prototype.ocupado = function() {
estadoAtual = this.xmlhttp.readyState;
return (estadoAtual && (estadoAtual < 4));
}

ajax.prototype.processa = function() {
if (this.xmlhttp.readyState == 4 && this.xmlhttp.status == 200) {
	return true;
}
}

ajax.prototype.enviar = function(url, metodo, modo) {
if (!this.xmlhttp) {
	this.iniciar();
}

if (!this.ocupado()) {

	if(metodo == "GET") {
 this.xmlhttp.open("GET", url, modo);
 this.xmlhttp.send(null);
	} else {
 this.xmlhttp.open("POST", url, modo);
 this.xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=UTF-8");
 this.xmlhttp.setRequestHeader("Cache-Control", "no-store, no-cache, must-revalidate");
 this.xmlhttp.setRequestHeader("Cache-Control", "post-check=0, pre-check=0");
 this.xmlhttp.setRequestHeader("Pragma", "no-cache");
 this.xmlhttp.send(url);
	}

	if (this.processa) {
 return unescape(this.xmlhttp.responseText.replace(/\+/g," "));
	}
}
return false;
}

funcoes.js:

function envia(url, metodo, modo)
{

var login = document.getElementById('form1').login.value;
remoto = new ajax();
xmlhttp = remoto.enviar(url + "?login=" + login, metodo, modo );
if(xmlhttp) {
	document.getElementById('login').className = 'erro';
	document.getElementById('alerta').className = 'alerta2';
	document.getElementById("alerta").innerHTML = 'Esse usuario ja esta cadastrado';

} else {

	document.getElementById('login').className = 'texto';
	document.getElementById('alerta').className = '';
	document.getElementById("alerta").innerHTML = '';
}
}

receber.php:

<?php
$texto = $_REQUEST["login"];
// no lugar do if basta fazer uma conexao com o banco e um select pesquisando o nome do usuario se ja existe

//acho que todos sabem fazer isso ne?

if($texto == "Fulano") {
echo true;

} else {

echo false;
}
?>

bom ta ai só com o funcional para vcs adaptarem do jeito que achar melhor

e quem nao conseguir só postar as duvidas

Discussão (43)

Entre ou cadastre-se para participar da discussão

Entrar Criar conta

Epyllion· 31 de jan.

Parabéns, Fabyo.Mais um ótimo tutorial. :clap: :thumbsup:

cocacola· 5 de mar.

era problema aqui mesmo

Milton Júnior· 23 de mar.

parabéns Fabyo, muito bom!

mas fiquei com 3 duvidas:

o que fazem as funcoes ajax.prototype.ocupado() e ajax.prototype.processa()?

porque você usou o modo síncrono(false)? você sabe que ele pode congelar o browser do usuario se o script demorar muito pra ser executado.

vi essa explicação neste tuto

http://www.tableless.com.br/artigos/ajaxdemo2/

se eu mudar para modo=true precisaria alterar mais alguma coisa do script?

Fabyo· 23 de mar.

nao é só mudar de false para true mesmo

e processa e ocupado tem haver com o status da conexao do ajax, só você ver uma tabela dai você entende melhor e os numeros que o status retorna

crucifier· 29 de mar.

muito bom kra...otimo script...sem comentarios!era exatamente o q eu estava procurando! :joia:

flavialieggio· 5 de abr.

Se alguem ler esse topico, por favor me ajude!

Amei o tutorial, você esta de parabens Fabyo!!! Mas tem algo que nao estou conseguindo fazer para validar meu usuario... acho que e alguma coisa na hora da select... na verdade eu utilizo procedures.. vou postar o codigo do RECEBE.PHP

<?php$texto = $_REQUEST["login"];// no lugar do if basta fazer uma conexao com o banco e um select pesquisando o nome do usuario se ja existe//acho que todos sabem fazer isso ne?$db = ocilogon("n "," n"," n");if(!$db){	die("<script>alert("Ocorreu um erro na tentativa de conexão com o Servidor!");javascript:window.location='fundo.php';</script>"); }else{	$curs = ocinewcursor($db);	$stmt = ociparse($db,"begin sipesca.pescasp001_usuario(:p_cursor,'$texto'); end;");	ocibindbyname($stmt,":p_cursor",$curs,-1,OCI_B_CURSOR);	ociexecute($stmt);	ociexecute($curs);	$sucess = ocifetchinto($curs,$data,OCI_RETURN_NULLS|OCI_ASSOC);	if($sucess){ for($i=1; $i < $curs; $i++){ $cd_usuario = $data["NU_USUARIO"]; $privilegio = $data["NU_PRIVILEGIO"]; $nome_usuario = $data["DE_USUARIO"]; $login = $data["DE_LOGIN"]; $senha = $data["DE_SENHA"]; if($nome_usuario) { echo true; } else { echo false; } } // fecha else } // fecha o loop	} //fecha o sucessOCIFreeCursor($curs);}ocilogoff($db);?>dai toda hora que digito ate mesmo um nome de um usuario que nao existe, ele afirma que o usuario ja existe...../applications/core/interface/imageproxy/imageproxy.php?img=http://forum.imasters.com.br/public/style_emoticons/default/sad.gif&key=02b1574f7da1e723d8a7dbae07272745fb341b432c19ce24d0490ce410222838" alt="Imagem Postada" />

Agradeço pela atenção!!

Flávia

Douglas· 5 de abr.

Você precisa imprimir true ou false, ou seja coloque eles entre aspas para serem impressos na tela.

<?php$texto = $_REQUEST["login"];// no lugar do if basta fazer uma conexao com o banco e um select pesquisando o nome do usuario se ja existe//acho que todos sabem fazer isso ne?$db = ocilogon("n "," n"," n");if(!$db){	die("<script>alert(\"Ocorreu um erro na tentativa de conexão com o Servidor!\");javascript:window.location='fundo.php';</script>"); }else{	$curs = ocinewcursor($db);	$stmt = ociparse($db,"begin sipesca.pescasp001_usuario(:p_cursor,'$texto'); end;");	ocibindbyname($stmt,":p_cursor",$curs,-1,OCI_B_CURSOR);	ociexecute($stmt);	ociexecute($curs);	$sucess = ocifetchinto($curs,$data,OCI_RETURN_NULLS|OCI_ASSOC);	if($sucess){ for($i=1; $i < $curs; $i++){ $cd_usuario = $data["NU_USUARIO"]; $privilegio = $data["NU_PRIVILEGIO"]; $nome_usuario = $data["DE_USUARIO"]; $login = $data["DE_LOGIN"]; $senha = $data["DE_SENHA"]; if($nome_usuario) { echo "true"; } else { echo "false"; } } // fecha else } // fecha o loop	} //fecha o sucessOCIFreeCursor($curs);}ocilogoff($db);?>

micox· 5 de abr.

Quem fabricou a classe javascript ajax que tá no ajax.js? É que eu vou usar ela como padrão nos meus códigos ajax e acho que seria bom dar os créditos pro cara. alguem sabe?

Fabyo· 5 de abr.

Eu que criei, mas é tudo padrao nao muda nada, e sabe como é nada se cria tudo se copia, para eu fazer esse script eu tive que ver outros e entender e modificar e assim vai

pode usar de boa

flavialieggio· 6 de abr.

Você precisa imprimir true ou false, ou seja coloque eles entre aspas para serem impressos na tela.

Olá Douglas,

Obrigada pela atenção, mas nao deu certo.... continua na mesma...qdo digito o nome de um usuario que nao existe ele afirma que existe /applications/core/interface/imageproxy/imageproxy.php?img=http://forum.imasters.com.br/public/style_emoticons/default/sad.gif&key=02b1574f7da1e723d8a7dbae07272745fb341b432c19ce24d0490ce410222838" alt="Imagem Postada" /> ..... realmente nao sei.....

Fabyo· 6 de abr.

dentro do for da um echo no $data["DE_USUARIO"] e ve o que aparece

você diz que mesmo que você digite um usuario que nao existe ele fala que existe entao ve ai o resultado desse select

flavialieggio· 7 de abr.

Olá Fabyo,

Desculpa a demora para responder e muito obrigada por atender ao meu pedido.... valeu mesmo, mas nao apareceu nada!! E continua fazendo a mesma coisa, qdo digito o nome de um user que nao existe ele afirma que existe..... /applications/core/interface/imageproxy/imageproxy.php?img=http://forum.imasters.com.br/public/style_emoticons/default/sad.gif&key=02b1574f7da1e723d8a7dbae07272745fb341b432c19ce24d0490ce410222838" alt="Imagem Postada" />

[]´s

Fabyo· 7 de abr.

entao mas testa seu select para ver o que ta acontecendo se você faz um select procurando por um nome se ele nao existe nao pode dizer que existe o erro deve estar no resultado do seu select debuga ele para ver

flavialieggio· 7 de abr.

Ah ta.... mas tira uma duvida... eu uso essa select numa outra forma de autenticação de usuario... logico que nao e com o ajax, a forma simples..... e funciona beleza... vou postar pra tu ver:

<?php$log = $_POST["login"];$pass = $_POST["senha"];session_start();$db = ocilogon("ss","sss","ssss");if(!$db){ die("<script>alert("Ocorreu um erro na tentativa de conexão com o Servidor!");javascript:window.location='index.php';</script>"); } else{	$curs = ocinewcursor($db);	$stmt = ociparse($db,"begin sipesca.pescasp001_usuario(:p_cursor,'$log'); end;");	ocibindbyname($stmt,":p_cursor",$curs,-1,OCI_B_CURSOR);	ociexecute($stmt);	ociexecute($curs);	$sucess = ocifetchinto($curs,$data,OCI_RETURN_NULLS|OCI_ASSOC);	if($sucess){ for($i=1; $i < $curs; $i++){ $cd_usuario = $data["NU_USUARIO"]; $privilegio = $data["NU_PRIVILEGIO"]; $nome_usuario = $data["DE_USUARIO"]; $login = $data["DE_LOGIN"]; $senha = $data["DE_SENHA"]; if(md5($pass) != $senha){ echo "<script>alert("Senha incorreta, tente novamente!");javascript:window.location='index.php';</script>"; exit; } // fecha if else{ $_SESSION["DE_LOGIN"] = $login; $_SESSION["DE_SENHA"] = $senha; if($privilegio < '4'){ echo "<script>alert("Olá, seja bem vindo a área restrita!");javascript:window.location='principal.php';</script>"; exit; } else { echo "<script>alert("Olá, seja bem vindo a área do administrador, $nome_usuario!");javascript:window.location='adm/adm.php';</script>"; exit; } } // fecha else } // fecha o loop	} //fecha o sucess	else{ die("<script>alert("Usuário incorreto ou não cadastrado no Sistema!");javascript:window.location='index.php';</script>");	}	ocifreecursor($curs);	ocilogoff($db); }?>So que ai amei esse tuto e to querendo ver se consigo implementar.... /applications/core/interface/imageproxy/imageproxy.php?img=http://forum.imasters.com.br/public/style_emoticons/default/blush.gif&key=f6a5c954d3ce314ccbf11c80df62cd69678ebe08083bba34a9e33b236604a674" alt="Imagem Postada" />

Mas de qualquer forma to testando aqui

[]´s

Loki-kun· 11 de abr.

Bom eu fiz tudo bunitinho no meu pc rodando o apache ficou beleza rodou uma maravilhaMais na hora de enviar para a internet ai veio a caca não funciona de jeito algumAlguem sabe o que está havendo?Flws

MrEd· 22 de abr.

Fabyo, como eu faço se eu quiser que ao invés de dizer que o usuário existe, eu imprimir o nome do usuário num campo qualquer do form? A minha dúvida é para fazer com que o AJAX traga o nome que esta cadastrado no BD.

if(xmlhttp) { document.getElementById("mName").innerHTML = 'o que eu tenho que por aqui pra imprimir o nome que esta no bd???';}

Se alguem além do Fabyo puder responder eu agradeço.

Fabyo· 24 de abr.

só fazer um select e retornar o nome do usuario

o resultado você pega no xmlhttp.responseText

MrEd· 24 de abr.

>
só fazer um select e retornar o nome do usuario

o resultado você pega no xmlhttp.responseText

Foi isso que eu imaginei, so que qnd eu faço isso o valor que esta sendo impresso pelo AJAX é undefined. Eu ja verifiquei se o select esta retornando algo e esta.

augustogava· 4 de mai.

Eu fiz aqui e tive que alterar para funcionar pois sempre dava que existia

<?phpinclude("conecta.php");$pc=$_SESSION["mpc"];$texto = $_REQUEST["login"];$tipo = $_REQUEST["tipo"];$sqla=mysql_query("SELECT * FROM apqp_car WHERE numero='$texto' AND peca='$pc' AND tipo='$tipo'");if(mysql_num_rows($sqla)){ echo 1;}else{ echo 0;}	//print "SELECT * FROM apqp_car WHERE numero='$texto' AND peca='$pc'";?>

function envia(url, metodo, modo, tipo){	var login = document.getElementById('frmcar').numero.value;	//var tipo = document.getElementById('frmcar').tipo.value;	remoto = new ajax();	xmlhttp = remoto.enviar(url + "?login=" + login + '&tipo=' + tipo, metodo, modo );	if(xmlhttp=='1') { document.getElementById("teste2").innerHTML = 'Número já cadastrado!'; document.getElementById('frmcar').incluir.disabled=true;	} else { document.getElementById("teste2").innerHTML = ''; document.getElementById('frmcar').incluir.disabled=false;	}	}

misterviralata· 6 de jul.

Ola Fabyo!estou com uma duvida a pagina cadastro.html não está funcionando corretamente, na barra de status aparece a seguinte mensagem concluido mas contém erro, e quando digito um nome no campo login não acontece nada, quando clico no campo senha na barra de status aparece uma mensagem contem erro na pagina.Na pagina recebe.php fiz o select, mas não ta funcionando poderia me ajudar?

ronanlumb· 8 de set.

Vou tentar denovo. Pois não funcionou. Não estava retornado nada. Vou ver novamente.

ronanlumb· 8 de set.

Continua nada. Não esta retornando nada nem que existe nem que não existe.Simplesmente não retorna nada.

Fabyo· 8 de set.

o problema é que no forum ele separa a palavra javascript ficando java script, dai por isso que nao funciona corrija no seu script:

cadastro.html:

onblur="java script: envia('receber.php', 'POST', false);"

e aproveitando faça uma modificação:

receber.php:

<?php
echo $_REQUEST["login"] == "Fulano" ? true : false;
?>

funcoes.js:

antes:

if(xmlhttp) {

depois:

if(xmlhttp == false) {

qualquer duvida só postar

ronanlumb· 8 de set.

Isso esta certo?

<div id="alerta"></div><table width="20" bgcolor="#FBFBFB" align="center"> <tr> <td nowrap="nowrap"colspan="3"></td> <tr> <td bgcolor="<?=$fundo_usuario?>" nowrap="nowrap" width="150">User ID: </td> <td bgcolor="<?=$fundo_usuario?>" colspan="2"><input name="login" type="text" id="login" maxlength="12" onblur="java script:envia('receber.php', 'POST', false);"> * </td> </tr>OBS: no cófigo está escrito java script:envia('receber.php' tudo junto

Pq não está retornando nada.

Sadjow· 11 de set.

parabéns!^^e para comparar dois campos .. tipow senha1 e senha2^^e se tiver diferente ..... a o estilo de CSS mudar da caixa de texto ...??tem como ?tipow assim: se as senhas tiverem diferentes... o fundo da caixa de texto fica vermelho.... ^^ se iguais ficam verdes...se alguem souber ajuda ae^^