Ir para conteúdo
claudio51

Habilitar campo somente quando o campo Cpf for validado e consultado no banco

Recommended Posts

Estou tentando resolver um probleminha com um formulário de cadastro. Gostaria que ao cadastrar um novo usuário, os campos só fossem habilitados depois que o campo CPF fosse validado e consultado no banco, se não houvesse sido cadastrado, então habilitaria os outros campos. O código está funcionando, com validação e consulta, mais sempre que valida o CPF, já habilita os outros campos, mesmo que já tenha sido cadastrado no banco. São códigos encontrados na web,que estou tentando adaptar a um formulário.

 

<!DOCTYPE html>
  <html>
  <head>
  <style>
  #cpf{
  padding-left:5px;
  }
  </style>
  </head>
  <body>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
   
  Cpf &nbsp&nbsp&nbsp <input type="text" id="cpf" maxlength="11" /><span style="color:blue" id="resposta"></span><span style="color:red" id='respostaCpf'></span><br><br>
  Nome <input type="text" id="nome" disabled="disabled" /><br><br><br>
  <script type="text/javascript">
   
   
  /*!
  * Gerador e Validador de CPF v1.0.0
  * https://github.com/tiagoporto/gerador-validador-cpf
  * Copyright (c) 2014-2015 Tiago Porto (http://www.tiagoporto.com)
  * Released under the MIT license
  */
   
  function CPF()
  {
  document.getElementById('cpf').focus();
  "user_strict";
  function r(r)
  {
  for(var t=null,n=0;9>n;++n)t+=r.toString().charAt(n)*(10-n);
  var i=t%11;return i=2>i?0:11-i
  }
  function t(r)
  {
  for(var t=null,n=0;10>n;++n)t+=r.toString().charAt(n)*(11-n);
  var i=t%11;
  return i=2>i?0:11-i
  }
  /*var n=" CPF Inválido",i=" CPF Válido";*/
  var n="",i=" CPF válido";
  this.gera=function()
  {
  for(var n="",i=0;9>i;++i)n+=Math.floor(9*Math.random())+"";
  /*var o=r(n),a=n+"-"+o+t(n+""+o);*/
  var o=r(n),a=n+o+t(n+""+o);
  return a
  },
  this.valida=function(o)
  {
  for(var a=o.replace(/\D/g,""),u=a.substring(0,9),f=a.substring(9,11),v=0;10>v;v++)
  if(""+u+f==""+v+v+v+v+v+v+v+v+v+v+v)
  return n;
  var c=r(u),e=t(u+""+c);
  return f.toString()===c.toString()+e.toString()?i:n
  }
  }
   
   
  var CPF = new CPF();
  //document.write(CPF.valida("123.456.789-00"));
   
  //document.write("<br> Utilizando o proprio gerador da lib<br><br><br>");
  for(var i =0;i<10;i++) {
  var temp_cpf = CPF.gera();
  document.write(temp_cpf+" = "+CPF.valida(temp_cpf)+"<br>");
  }
   
  $("#cpf").keyup(function(){
  $("#resposta").html(CPF.valida($(this).val()));
  if (CPF.valida($(this).val())==" CPF válido")
  {
  nome.disabled=false;
  }else{
  nome.disabled=true;
  }
  });
   
  $("#cpf").blur(function(){
  $("#resposta").html(CPF.valida($(this).val()));
  if (CPF.valida($(this).val())==" CPF válido")
  {
  nome.disabled=false;
  }else{
  nome.disabled=true;
  }
  /*nome.disabled=false;*/
  });
  </script>
  <script language="javascript">
  var cpf = $("#cpf");
  //email.keyup(function() {
  cpf.keyup(function() {
  $.ajax({
  url: 'verificaCpf.php',
  type: 'POST',
  data:{"cpf" : cpf.val()},
  success: function(data) {
  console.log(data);
  data = $.parseJSON(data);
  $("#respostaCpf").text(data.cpf);
  }
  });
  });
  </script>
  </body>
 

</html>

 

verificaCpf.php

 

 

<?php


#Verifica se tem um cpf para pesquisa
if((isset($_POST['cpf']))AND($_POST['cpf']<>' ')){ 

    #Recebe o Cpf Postado
    $cpfPostado = $_POST['cpf'];

    #Conecta banco de dados 
    $con = mysqli_connect("localhost", "root", "", "cadastro");
    $sql = mysqli_query($con, "SELECT * FROM cliente WHERE cpf = '{$cpfPostado}'") or print mysql_error();

    #Se o retorno for maior do que zero, diz que já existe um.
    if(mysqli_num_rows($sql)>0) 
        echo json_encode(array('cpf' => ' CPF já cadastrado')); 
    else 
       echo json_encode(array('cpf' => '')); 
       
}
?>

Compartilhar este post


Link para o post
Compartilhar em outros sites

Ok mais eu queia apenas resolver a funcionalidade do código, a segurança ainda é um passo a frente. Gostaria que o campo abaixo, ou todos os campos, fossem habilitados ao validar e verificar no banco o campo Cpf. acredito que nessa linha abaixo.

if (CPF.valida($(this).val())==" CPF válido"|| outra condição, mais qual?)
  {
  nome.disabled=false;
  }else{
  nome.disabled=true;
  }

Acho que sei mais ou menos o que está acontecendo, o código que valida o CPF está na mesma página em que está o formulário, é mais fácil pegar um resultado e fazer uma aplicação, porém o código que verifica o banco, está em outra página, enviando apenas o resultado para uma div via json, acho que para pegar um referencial e usar como mais uma condição no javascript, teria que enviar de lá como um post por ex, ou uma variável através de algum mecanismo Ajax, talvez via json.

 

Acho que entendi agora a questão da segurança, esse código tá furado, a cada número digitado, vai haver uma chamada desnecessária ao banco, vou tentar outra lógica.

Estava pensando se poderia ser assim:

1 função somenteNúmeros() 
        no campo imput

Funções integradas:

2 função contarCaracteres()
        Ao chegar a 11 caracteres passa
        para o proxima função
3 função validarCPF()
        Se o CPF for válido, retorna true
        e passa para a próxima função
4 função consultarBanco()
        Se o CPF não foi cadastrado,
        retorna false

No final se o retorno for "true e false", habilita os outros campos input

 

O código ficou bom, funciona, valida o cpf, consulta o banco, e só depois abre o restante do formulário, deixando o campo cpf somente leitura. 

 

https://www.4shared.com/rar/Y9GiGftVda/cadastro_de_pessoas_configurao.html?

 

Editado por claudio51
Terminei o projeto

Compartilhar este post


Link para o post
Compartilhar em outros sites

Crie uma conta ou entre para comentar

Você precisar ser um membro para fazer um comentário

Criar uma conta

Crie uma nova conta em nossa comunidade. É fácil!

Crie uma nova conta

Entrar

Já tem uma conta? Faça o login.

Entrar Agora

  • Conteúdo Similar

    • Por Luiz Fernando 111
      Caros amigos, estou tentando adicionar soma entre inputs do html e do javascript, mas com esse exemplo, apenas consegui colocar no input do html. Como faço para implementar no input do javascript e somar o valor junto com o Valor Total mostrar lucro quando foi debito e prejuizo quando for crédito ? Alguém poderia me dá help !!!
       
       

    • Por allancisneiro
      pessoal boa tarde, estou construindo um arquivo HTML, porém estou com um problema de alinhamento do texto apartir do segundo<H1>.  já tentei  usar o comando align:"left". mas não funcionu.
      quem puder ajudar agradeço. a ideia é alinhar tudo à esquerda
       
      este arquivo contém este código-fonte:
       
      <!DOCTYPE html>
      <html>
      <head>
      <title>Título da página</title>
      <meta charset="utf-8"/>
      </head>
      <body>
      <h1>Lista não ordenada</h1>
      <ul>
      <li>LIVERPOOL</li>
      <li>CHELSEA</li>
      <li>MANCHESTER CITY</li>
      <li>MANCHESTER UNITED</li>
      <li>ARSENAL</li>
      <li>TOTTENHAM</li>

      <h1 align="left">Lista ordenada</h1>
      <OL>
      <li>LIVERPOOL</li>
      <li>CHELSEA</li>
      <li>MANCHESTER CITY</li>
      <li>MANCHESTER UNITED</li>
      <li>ARSENAL</li>
      <li>TOTTENHAM</li>

      </OL>
          
      </body>
      </html>

    • Por Robson Augusto
      Galera se alguém souber o que ocorre,  é o seguinte, não acredito que possa ser Problema de SEO, mas vamos lá meu site anuncicarbh.com, não aparece em pesquisa feitas pelo computador, com a palavra chave "seminovos bh", ele aparece na primeira oscilando para segunda pagina do bing e yahoo, fazendo a pesquisa pelo telefone, ja no pc ele nao aparace mais no yahoo, mas continua a aparecer no bing, ja no google ele teve pequenas aparições na terceira página, agora em ambas as pesquisas de pc e celular ja não aparece mais no google... So aparece atualmente no google, pesquisando pelo nome do site... Alguem saberia me dizer o por que disso? será SEO?
    • Por nosredna
      Olá amigos,
       
      tenho o seguinte código:
      <html> <script type="text/javascript"> function Soma(){ var soma = 0; var ipts = document.querySelectorAll('input[oninput="Soma()"]'); for(var x=0; x<ipts.length; x++){ var valorItem = parseFloat(ipts[x].value); !isNaN(valorItem) ? soma += parseFloat(valorItem) : null; } document.querySelector('#final').value = soma.toFixed(2); } </script> <form action=""> Total produto1: <input type="text" oninput="Soma()" value="0"><br> Total produto2: <input type="text" oninput="Soma()" value="0"><br> <br> Total todos os produtos12: <input type="text" id="final"> </form> </html> Bom...para essas duas inputs funciona corretamente.
      Porém, se eu quiser colocar mais inputs como: Total produto3 + Total produto4 = Total todos os produtos34, Total produtoX + Total produtoY = Total todos os produtosXY, ...
      e usar o mesmo código JS, é possível? alguém poderia me dar uma dica de como eu faço para fazer isso? já tentei de várias maneiras, mas não estou tendo sucesso...
       
      Fico agradecido. 
    • Por 4ly
      Olá. Bom basicamente eu tenho um botão âncora que leva até a aba de sobre do meu site, só que ele não tem animação, ele simplesmente "teleporta" para essa aba do nada isso não é legal. 
      Gostaria de saber algum código de JavaScript ou CSS para solucionar isso 
      Esse é o código : 
       
      <button id="explorer"><a href="#about">Explorar</a></button>
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.