Call php function using onblur (complete)

0

I have an onblur event to call a function and this function has to call a php class to be able to compare what was typed in the input with what is in my DB, but I do not know how to do that using jquery, how do I do this?

HTML

<html>
<head>
<title>Validação de campos com AJAX</title>
<script 
src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><scripttype="text/javascript" src="assets/ajax/check_cnae.js"></script>
</head>
<body>

Login: <br /> <input type="text" id="cnae" onblur="validarDados('cnae', document.getElementById('cnae').value);" />
<div id="campo_cnae"> </div>

</body>
</html>

class

require_once "Conexao.class.php";

class Socio {    
  private $con;
  private $cnae; 

public function __construct(){
    $this->con = new Conexao();
}

public function __set($atributo, $valor){
    $this->$atributo = $valor;
}

public function __get($atributo){
    return $this->$atributo;
}

public function cnae(){
    $this->cnae = $_GET['valor'];
        $validar = $this->con->conectar()->prepare("SELECT cnae FROM cnae WHERE cnae = ?");
        $validar->execute(array($this->cnae));   
        if($validar->rowCount() == 0){
            echo "CNAE invalido.";
        }else{
            echo "CNAE valido.";
        }
}

script

var req;

function validarDados(campo, valor) {

// Verificar o Browser
// Firefox, Google Chrome, Safari e outros
if(window.XMLHttpRequest) {
   req = new XMLHttpRequest();
}
// Internet Explorer
else if(window.ActiveXObject) {
   req = new ActiveXObject("Microsoft.XMLHTTP");
}

// Aqui vai o valor e o nome do campo que pediu a requisição.
var url = "../../index_teste2.php?campo="+campo+"&valor="+valor;

// Chamada do método open para processar a requisição
req.open("Get", url, true);

// Quando o objeto recebe o retorno, chamamos a seguinte função;
req.onreadystatechange = function() {

// Exibe a mensagem "Verificando" enquanto carrega
if(req.readyState == 1) {
    document.getElementById('campo_' + campo + '').innerHTML = '<font color="gray">Verificando...</font>';
}

// Verifica se o Ajax realizou todas as operações corretamente (essencial)
if(req.readyState == 4 && req.status == 200) {
// Resposta retornada pelo validacao.php
var resposta = req.responseText;

// Abaixo colocamos a resposta na div do campo que fez a requisição
document.getElementById('campo_'+ campo +'').innerHTML = resposta;
}
}
req.send(null);
}

PHP file that receives instantiation

require_once 'classes/Socio.class.php';

$socio = new Socio();

if(isset($_GET['valor'])){
    $dados = $socio->cnae($_GET['valor']);
}
    
asked by anonymous 07.12.2018 / 23:48

1 answer

1

Basically an Ajax function works with this structure (I'm putting an example, you need to adapt it for your use).

This script will make a request for the verificaDado.php file using the GET method. It is also explicit that data of type json will be passed and returned of type html , I am assuming you only return a true or false , if it returns something more complex (an array for example) is I need to change to dataType: 'json' and in php change to echo json_encode($seuArray) .

Here are sample codes:

<script type="text/javascript">
    //Essa variável recebe o valor do input
    var inputVal = $('input').val();

    $.ajax({
      type: "get",
      url: "verificaDado.php",
      data: { value: inputVal },
      dataType: 'html',
      contentType: "json"
  }).done(function(obj) {
    //Caso de tudo certo com o ajax vai cair aqui e a variavel obj é o retorno
  }).fail(function(){
    //Caso ocorra alguma falha no ajax cai aqui
  });

</script>

In PHP:     

 $socio = new Socio();

 //O echo funciona como o retorno para o ajax, então o que for mostrado na tela vai voltar para o Ajax
 echo $socio->funcao_para_verificar($_GET['value']);
    
10.12.2018 / 14:46