Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Estou utilizando o Spry do Dreamweaver para validar os campos digitados no formulário, porém, além dessa validação, em alguns campos (CPF, CNPJ e login) eu preciso verificar o banco de dados pra checar se já existe algum cadastro com esses dados e não permitir cadastro duplicados com essas informações.
Com a utilização do Spry precisaria fazer essa verificação nos mesmos moldes, com ajax/javascript e on Blur, ou seja, assim que o usuário sair do campo.
A princípio eu teria 3 passos:
1. Adicionar a informação no campo para chamar a função javascript em on Blur;
2. A Função javascript acionaria o código php para fazer a verificação e retornar o resultado;
3. Em caso de existir valor semelhante mostrar a mensagem de erro.
Parece simples até, mas para os meus ínfimos conhecimentos, não consigo fazer.. procurei pela net e não achei nada que eu pudesse ou conseguisse adaptar.
Abaixo meu campo, como exemplo, do CPF - com a validação Spry e auto-formatação:
<span id="sprytextfield3">
<input name="acadind_cpf" type="text" id="acadind_cpf" size="15" maxlength="14" onkeypress="formatar_mascara(this, '###.###.###-##')" /> <a href="#" class="ajuda"><img src="img/ajuda.gif" alt="ajuda" width="16" height="16" border="0" /><span>use somente números.</span></a><span class="textfieldRequiredMsg"><img src="img/erro.gif" alt="erro" />O campo CPF está em branco.</span></span>
* como eu incluo o passo 1 e o 3?
* como seria a função para chamar a pág. PHP?
Para verificar a existência de determinado dado em PHP eu faria assim, se fosse após o submit do form:
<?php
$acadind_cpf = $_GET['acadind_cpf'];
$busca_cpf = mysql_query("SELECT * FROM cadastros WHERE acadind_cpf = '$acadind_cpf'");
$tem_cpf = mysql_num_rows($busca_cpf);
if ($tem_cpf) {
echo("<script>
alert(\"Já existe um cadastro com este CPF em nosso banco de dados\");
window.location = 'java script:history.back(-1)';
</script>");
break;
}
?>Dessa forma, é claro funciona, mas aí eu teria que recarregar a página e usar session para o form trazer todos os dados digitados. Então, utilizando-se ajax/javascript esse código teria que ser alterado para voltar ao javascript retornar a mensagem de erro.
Bem, espero ter sido claro, mesmo porquê não sei se o raciocínio está correto em termos do caminho a percorer para realizar essa ação.
é.. pra mim tb está mostrando o mesmo erro... e ao que tudo indica esse erro é porquê o código não conseguiu acessar a tabela do banco de dados...
depois de vários testes alterando caminho do arquivo e do sql para a busca no bd essa mensagem sumiu, mas, em compensação, não deu a mensagem de erro dizendo que o documento já existia no bd...
Postem a estrutura da tabela e o script contendo o Select.
busca_docs.php
<?php
require 'config.php';
if(!empty($_GET["acadind_cpf"])) {
$acadind_cpf = $_GET["acadind_cpf"];
$seleciona = "SELECT * FROM cadastros WHERE acadind_cpf = '" . $acadind_cpf . "' LIMIT 1";
$resultado = mysql_query($seleciona) or die (mysql_error());
$linhas = mysql_num_rows($resultado);
if ($linhas != 0) {
echo "Este CPF já está cadastrado em nosso sistema, não é permitido dois cadastros para o mesmo documento.";
}
else {
echo "";
}
}
else {
echo "<script>alert('ERRO!');</script>";
}
?>
buscadocs.js
function buscaCPF(valor) {
url = "busca_docs.php?acadind_cpf="+valor;
req = null;
// Procura por um objeto nativo (Mozilla/Safari)
if (window.XMLHttpRequest) {
req = new XMLHttpRequest();
req.onreadystatechange = processReqChange;
req.open("GET",url,true);
req.send(null);
// Procura por uma versão ActiveX (IE)
}
else if (window.ActiveXObject) {
req = new ActiveXObject("Microsoft.XMLHTTP");
if (req) {
req.onreadystatechange = processReqChange;
req.open("GET",url,true);
req.send();
}
}
}
function processReqChange() {
// apenas quando o estado for "completado"
if (req.readyState == 4) {
// apenas se o servidor retornar "OK"
if (req.status == 200) {
// procura pela div id="acadind_cpf" e insere o conteudo
// retornado nela, como texto HTML
document.getElementById('acadind_cpf').innerHTML = req.responseText;
}
else {
alert("Houve um problema ao obter os dados:" + req.statusText);
}
}
}
Estrutura BD // campo do CPF em destaque
-- Banco de Dados: apee
--
-- --------------------------------------------------------
--
-- Estrutura da tabela cadastros
--
CREATE TABLE `cadastros` (
`id_cadastro` int(7) NOT NULL auto_increment,
`tipo` varchar(11) NOT NULL default '',
`ind_empresa` varchar(60) NOT NULL default '',
`geral_nome` varchar(50) NOT NULL default '',
`acadind_natural` varchar(50) NOT NULL default '',
`ind_reg_crea` varchar(15) NOT NULL default '',
`ind_ano_format` varchar(4) NOT NULL default '',
`acad_ano_ingres` varchar(4) NOT NULL default '',
`acadind_inst_ens` varchar(50) NOT NULL default '',
`acad_curso` varchar(50) NOT NULL default '',
`acad_periodo_atual` varchar(15) NOT NULL default '',
`acadind_dt_nasc` varchar(10) NOT NULL default '0000-00-00',
`geral_email` varchar(100) NOT NULL default '',
`geral_email_alt` varchar(100) NOT NULL default '',
`acadind_end_res` varchar(130) NOT NULL default '',
`acadind_cep_res` varchar(9) NOT NULL default '',
`acadind_cidade_res` varchar(50) NOT NULL default '',
`acadind_estado_res` char(2) NOT NULL default '',
`acadind_ddd` smallint(2) NOT NULL default '0',
`acadind_telefone` varchar(12) NOT NULL default '',
`acadind_cpf` varchar(20) NOT NULL default '', ========> Campo do CPF
`corp_cnpj` varchar(20) NOT NULL default '',
`corp_razao_social` varchar(150) NOT NULL default '',
`corp_nome_fantasia` varchar(150) NOT NULL default '',
`corp_insc_est` varchar(20) NOT NULL default '',
`corp_crea_pr` varchar(15) NOT NULL default '',
`corp_princ_ativ` text NOT NULL,
`corp_repres_legal` varchar(50) NOT NULL default '',
`ind_area_atua` varchar(50) NOT NULL default '',
`corpind_end_com` varchar(130) NOT NULL default '',
`corpind_cidade_com` varchar(50) NOT NULL default '',
`corpind_estado_com` varchar(30) NOT NULL default '',
`corpind_cep_com` varchar(9) NOT NULL default '',
`corpind_ddd_com` char(2) NOT NULL default '',
`corpind_telefone_com` varchar(10) NOT NULL default '',
`userlog` varchar(15) NOT NULL default '',
`vercodpass` varchar(50) NOT NULL default '',
`geral_dddfax` smallint(2) NOT NULL default '0',
`geral_fax` varchar(12) NOT NULL default '',
`acadind_dddcel` smallint(2) NOT NULL default '0',
`acadind_celular` varchar(12) NOT NULL default '',
`corp_dir1_nome` varchar(50) NOT NULL default '',
`corp_dir1_cargo` varchar(40) NOT NULL default '',
`corp_dir1_curso` varchar(100) NOT NULL default '',
`corp_dir1_dtconc` varchar(10) NOT NULL default '0000-00-00',
`corp_dir1_instens` varchar(130) NOT NULL default '',
`corp_dir1_regcrea` varchar(20) NOT NULL default '',
`corp_dir1_titprof` text NOT NULL,
`corp_dir2_nome` varchar(50) NOT NULL default '',
`corp_dir2_cargo` varchar(40) NOT NULL default '',
`corp_dir2_curso` varchar(100) NOT NULL default '',
`corp_dir2_dtconc` varchar(10) NOT NULL default '0000-00-00',
`corp_dir2_instens` varchar(130) NOT NULL default '',
`corp_dir2_regcrea` varchar(20) NOT NULL default '',
`corp_dir2_titprof` text NOT NULL,
`corp_dir3_nome` varchar(50) NOT NULL default '',
`corp_dir3_cargo` varchar(40) NOT NULL default '',
`corp_dir3_curso` varchar(100) NOT NULL default '',
`corp_dir3_dtconc` varchar(10) NOT NULL default '0000-00-00',
`corp_dir3_instens` varchar(130) NOT NULL default '',
`corp_dir3_regcrea` varchar(20) NOT NULL default '',
`corp_dir3_titprof` text NOT NULL,
`data_cad` datetime NOT NULL default '0000-00-00 00:00:00',
`newsletter` smallint(1) NOT NULL default '0',
`cod_ativacao` varchar(40) NOT NULL default '',
`ativado` smallint(1) NOT NULL default '0',
PRIMARY KEY (`id_cadastro`)
) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=12;
* em complemento.. sei que não precisava mandar a estrutura do BD inteira, mas foi só pra perceber o tamanho da encrenca... e ainda preciso fazer essa checagem no CPF, no CNPJ e no login... :(Funcionando, a não ser pelos caracteres especiais que não estão sendo exibidos corretamente.
Acrescente esse code no início do busca_docs.php:
header("Content-Type: text/html; charset=ISO-8859-1",true);
Qual navegador e versão foi usado no seu teste?
Gutto eu testei no FF 2.0, IE 6, IE 7 e Avant Browser e em nenhum deles funcionou, inclusive, tanto no IE quanto no Avant (que usa a engine do IE), após a saída do campo aparece mensagem de erro (aquela no canto inferior esquerdo) dizendo que deu "Erro em tempo de execução desconhecido"
Poste o code do seu form.
Está exibindo a mensagem "Erro em tempo de execução desconhecido" e também o alert com o erro? Ou apenas uma?
só a mensagem de erro...
..parte do código do form..
<tr valign="top">
<td>CPF:</td>
<td><span id="sprytextfield3">
<input name="acadind_cpf" type="text" id="acadind_cpf" size="15" maxlength="14" onkeypress="formatar_mascara(this, '###.###.###-##')" onBlur="if (this.value != '') { buscaCPF(this.value); }" />
<span title="header=[<style='vertical-align:middle'> CPF] body=[<img src='img/info.gif'> Use somente números.]" style="cursor:help"><img src="img/ajuda.gif" width="16" height="16" border="0" /></span>
<span class="textfieldRequiredMsg"><img src="img/erro.gif" alt="erro" />O campo CPF está em branco.</span></span>
</td>
</tr>Existem dois elementos com a mesma id: acadind_cpf.
Desculpe minha ignorância... não entendi.. onde??
O input do CPF e a DIV que recebe os dados do innerHTML, altere a id e name de um deles, pois os dois estão como acadind_cpf. Se for alterar a id da DIV, altere a referência na função js também.
:unsure:
até entendi a colocação mas continuo sem saber onde alterar..
no form não posso mudar a id (id="acadind_cpf") porquê é através desse id que vai cadastrar no bd..
no .js (document.getElementById('acadind_cpf').innerHTML = req.responseText;) ele vai buscar a id acadind_cpf do form
no script php eu tenho:
if(!empty($_GET["acadind_cpf"])) { // ==> verifica se a variável está ou não vazia
$acadindcpf = $_GET["acadind_cpf"]; // ==> chama
$seleciona = "SELECT * FROM cadastros WHERE acadind_cpf = '" . $acadindcpf . "' LIMIT 1"; // ==> verifica o bd
eu fiz alguns testes alterando os nomes aqui e não deu certo.. me perdi....Altere na função js:
document.getElementById('acadind_cpf').innerHTML = req.responseText;
Para...
document.getElementById('resultado_ajax').innerHTML = req.responseText;
E no HTML, altere:
<div id="acadind_cpf" name="acadind_cpf"></div>
Para...
<div id="resultado_ajax" name="resultado_ajax"></div>
Gutto essa alteração não dá certo...
não posso alterar a id do campo no form senão não consigo cadastrar o parâmetro no banco de dados. Além disso essa alteração também não vai 'comunicar' com o código php que verifica se o campo acadind_cpf está preenchido, se alterar no form teria que alterar tb no php o que vai dar no mesmo.. vai ficar igual apenas com outro nome...
é claro que, para testar, eu fiz as alterações e o erro é mesmo. http://forum.imasters.com.br/public/style_emoticons/default/upset.gif
Sugeri alterar o input ou a div, você testou com a alteração da div? Posta seu code completo, js, form e arquivo php.
sim Gutto eu fiz vários testes com várias alterações... agora está assim:
cadastro_acad.php (trecho)
<tr valign="top">
<td>CPF:</td>
<td><span id="sprytextfield3">
<input name="verifica_cpf" type="text" id="vrifica_cpf" size="15" maxlength="14" onkeypress="formatar_mascara(this, '###.###.###-##')" onBlur="if (this.value != '') { buscaCPF(this.value); }" />
<span title="header=[<style='vertical-align:middle'> CPF] body=[<img src='img/info.gif'> Use somente números.]" style="cursor:help"><img src="img/ajuda.gif" width="16" height="16" border="0" /></span>
<span class="textfieldRequiredMsg"><img src="img/erro.gif" alt="erro" />O campo CPF está em branco.</span></span>
</td>
</tr>
busca_docs.php
<?php
header("Content-Type: text/html; charset=ISO-8859-1",true);
require 'config.php';
if(!empty($_GET["verifica_cpf"])) {
$acadindcpf = $_GET["verifica_cpf"];
$seleciona = "SELECT * FROM cadastros WHERE acadind_cpf = '" . $acadindcpf . "' LIMIT 0,1";
$resultado = mysql_query($seleciona) or die (mysql_error());
$linhas = mysql_num_rows($resultado);
if ($linhas != 0) {
echo "Este CPF já está cadastrado em nosso sistema, não é permitido dois cadastros para o mesmo documento.";
}
else {
echo "";
}
}
else {
echo "<script>alert('ERRO!');</script>";
}
?>
buscadocs.js
function buscaCPF(valor) {
url = "busca_docs.php?verifica_cpf="+valor;
req = null;
// Procura por um objeto nativo (Mozilla/Safari)
if (window.XMLHttpRequest) {
req = new XMLHttpRequest();
req.onreadystatechange = processReqChange;
req.open("GET",url,true);
req.send(null);
// Procura por uma versão ActiveX (IE)
}
else if (window.ActiveXObject) {
req = new ActiveXObject("Microsoft.XMLHTTP");
if (req) {
req.onreadystatechange = processReqChange;
req.open("GET",url,true);
req.send();
}
}
}
function processReqChange() {
// apenas quando o estado for "completado"
if (req.readyState == 4) {
// apenas se o servidor retornar "OK"
if (req.status == 200) {
// procura pela div id="verifica_cpf" e insere o conteudo
// retornado nela, como texto HTML
document.getElementById('verifica_cpf').innerHTML = req.responseText;
}
else {
alert("Houve um problema ao obter os dados:" + req.statusText);
}
}
}
a propósito.. no campo do form não tem que ter um
<span id="verifica_cpf"></span> ou qqr coisa assim pra receber o resultado da consulta?
Precisa de um elemento sim, pode ser
<div id="resultado_cpf"></div>
no JS altere também essa linha:
document.getElementById('resultado_cpf').innerHTML = req.responseText;
Agora posta o erro que está surgindo.
hehehehe "agora posta o erro que está surgindo" foi boa...
de acordo com seu nick, você é, ou deve ser, de São Paulo.. se fosse de Curitiba te pagava, no mínimo, um almoço numa boa churrascaria!
além de saber o que faz, tem uma paciência de Jó....
http://forum.imasters.com.br/public/style_emoticons/default/clap.gif http://forum.imasters.com.br/public/style_emoticons/default/clap.gif http://forum.imasters.com.br/public/style_emoticons/default/clap.gif
deu um erro sim.. de 'headers already input....' foi só colocar ob_start no busca_docs.php e funcionou.. agora vou à batalha para fazer os outros dois campos e os outros dois formulários que site ainda tem...
Não tenho nem como agradeder toda a ajuda... valeu... http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif
Certo.
de acordo com seu nick, você é, ou deve ser, de São Paulo.. se fosse de Curitiba te pagava, no mínimo, um almoço numa boa churrascaria!
O SP foi como complemento, pois Gutto já estava em uso, sou de Brasília.
Poste o code para outros usuários. B)
certo.. vamos lá...
objetivo: Pegar dados digitados em um formulário e verificar no banco de dados, via javascript, se já existe informação semelhante retornando informação de erro em caso positivo, assim que o usuário deixa o campo (on Blur).
Na página do formulário inserir a chamada para o código java script:
<script src="nomedoarquivo.js"></script>
Campo do Form:
<input name="nome_do_campo" type="text" id="nome_do_campo" size="15" maxlength="14" onBlur="if (this.value != '') { buscaCPF(this.value); }" />
<span id="resultado_campo"></span>
O arquivo javascript
function buscaCPF(valor) {
url = "busca_info.php?nome_do_campo="+valor;
req = null;
// Procura por um objeto nativo (Mozilla/Safari)
if (window.XMLHttpRequest) {
req = new XMLHttpRequest();
req.onreadystatechange = processReqChange;
req.open("GET",url,true);
req.send(null);
// Procura por uma versão ActiveX (IE)
}
else if (window.ActiveXObject) {
req = new ActiveXObject("Microsoft.XMLHTTP");
if (req) {
req.onreadystatechange = processReqChange;
req.open("GET",url,true);
req.send();
}
}
}
function processReqChange() {
// apenas quando o estado for "completado"
if (req.readyState == 4) {
// apenas se o servidor retornar "OK"
if (req.status == 200) {
// procura pela div id="nome_do_campo" e insere o conteudo
// retornado nela, como texto HTML
document.getElementById('resultado_campo').innerHTML = req.responseText;
}
else {
alert("Houve um problema ao obter os dados:" + req.statusText);
}
}
}
O arquivo php
<?php
ob_start();
header("Content-Type: text/html; charset=ISO-8859-1",true);
require 'config.php'; // conexão com o banco de dados
if(!empty($_GET["nome_do_campo"])) {
$dado = $_GET["nome_do_campo"];
$seleciona = "SELECT * FROM nome_da_tabela WHERE campo_da_tabela = '" . $dado . "' LIMIT 0,1";
$resultado = mysql_query($seleciona) or die (mysql_error());
$linhas = mysql_num_rows($resultado);
if ($linhas != 0) {
echo "Mensagem de erro/duplicado";
}
else {
echo "";
}
}
else {
echo "<script>alert('ERRO!');</script>";
}
?>rcdesign, até que em fim heim? Meus parabéns.
Isso me fez lembrar o primeiro sisteminha que fiz aqui na intranet da minha empresa, à quase dois anos atrás,
ralei a beça, mas o resultado compensou
é klay não foi fácil e sem a preciosa ajuda/orientação do GuttoSP não teria saído do lugar...
e na verdade a coisa toda não acabou ainda..
neste mesmo formulário tenho mais um campo pra fazer a mesma coisa - o campo de Login - e, neste mesmo site, ainda tem outros dois formulários que, obviamente também precisam ser validados.
e aí já começaram novamente os problemas... :mellow:
é claro que, inicialmente, eu tentei o óbvio.. duplicar os códigos alterando as informações dos campos é lógico, mas não funciona..
em seguida separei os códigos, para cada campo um grupo separado de códs./págs. mas também não funciona...
estou agora pesquisando sobre o assunto tentando achar a solução, mas pra quem não entende nada - ou quase nada - de javascript não tá fácil...
Você pode usar o mesmo code, sem precisar duplicar, fazendo algumas alterações:
No formulário altere:
input name="nome_do_campo" type="text" id="nome_do_campo" size="15" maxlength="14" onBlur="if (this.value != '') { buscaCPF(this.value); }" />
Para...
input name="nome_do_campo" type="text" id="id_do_campo" size="15" maxlength="14" onBlur="if (this.value != '') { buscaCPF(this.name,this.value); }" />Irá enviar o nome do campo e seu valor para a função js.
Na função js, altere:
function buscaCPF(valor) {
Para...
function busca(campo,valor) {Como agora ela irá buscar diversos campos, não faz sentido chamá-la de buscaCPF. Acrescentamos um segundo parâmetro, campo, para sabermos qual campo ativou a chamada da função.
Agora altere:
url = "busca_info.php?nome_do_campo="+valor;
Para...
url = "busca_info.php?campo="+campo+"&valor="+valor;Essa parte irá informar para o busca_info.php o campo e o valor pegos na função js.
No busca_info.php altere:
if(!empty($_GET["campo"]) && !empty($_GET["valor"])) { // Confere se os dados enviados não estão vazios
$campo = $_GET["campo"];
$valor = $_GET["valor"];
$seleciona = "SELECT * FROM nome_da_tabela WHERE " . $campo . " = '" . $valor . "' LIMIT 0,1";Claro que nesse caso o nome dos elementos do formulário (inputs, textareas, selects) devem ter o mesmo nome dos campos da tabela do BD.
Se for exibir o alerta no mesmo elemento do code inicial, não altera mais nada. Caso queira exibir as mensagens de retorno em elementos distintos, acrescente os devidos campos no formulário e referencie o mesmo na função js. Identifique cada um com nomes e ids únicos, para não exibir a mensagem: Erro em tempo de execução desconhecido.
Para objetos de formulário, inputs, selects... utilize value para exibir o resultado da consulta. Para divs, tds, utilize innerHTML.
bem Gutto, mais uma vez obrigado.. eu pesquisei bastante sobre o assunto e tinha chegado até esse ponto:
onBlur="if (this.value != '') { buscaCPF(this.name,this.value); } { buscaCPF(this.name,this.value); }mas não estava sabendo como passar para o JS e consequentemente ao PHP..
como isso a pesquisa está sendo feita corretamente.. só não estou conseguindo fazer com que cada informação seja apresentada no lugar correto dentro do form... na verdade acredito que o form esteja correto.. o problema é no JS mesmo.. acho que tem que usar if mas não consegui fazer, tentei criar uma variável pra separar os dados mas também não deu...
o código era assim:
function processReqChange() {
// apenas quando o estado for "completado"
if (req.readyState == 4) {
// apenas se o servidor retornar "OK"
if (req.status == 200) {
// procura pela div id="verifica_cpf" e insere o conteudo
// retornado nela, como texto HTML
document.getElementById('resultado_cpf').innerHTML = req.responseText;
}
else {
alert("Houve um problema ao obter os dados:" + req.statusText);
}
}
}
incluindo apenas a referência ao outro campo, assim:
document.getElementById('resultado_cpf').innerHTML = req.responseText;
document.getElementById('resultado_login').innerHTML = req.responseText;a informação do erro é apresentada em ambos os campos independente se a busca foi no CPF ou no Login.. e é lógico isso, afinal o código está dizendo somente que é para lançar o resultado nesses campos...tentei então fazer assim:
if( document.getElementById("resultado_cpf").innerHTML = req.responseText;
if( document.getElementById("resultado_login").innerHTML = req.responseText;
mas assim está errado.. o erro não é mostrado..
alguma luz?
*obs: antecipadamente já vou adiantando minhas desculpas ao moderador do fórum por eventual bagunça neste post mas não vejo outra forma mais clara de explicar..
Empacou? Como está o code atualmente? Tem erro, qual? Posta aí.