Login with AJAX in PHP

0

I'm studying about mobile applications, hybrids, I'm using the phonegap and I'm having a problem. I can not log in, ajax sends the variables directly and php returns a value but ajax is not capturing this value to verify whether or not the user exists in the database. Follow the html and php code:

HTML

<!DOCTYPE html>
<html>
<head>
    <link rel='stylesheet' type="text/css" href="css/style.css">
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
    <title>Blank App</title>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script><scriptsrc="https://code.jquery.com/jquery-3.1.1.min.js"></script>
    <script language=javascript type="text/javascript">
    function Login(){
        var email = document.getElementById('email').value;
        var senha = document.getElementById('senha').value;
        console.log(email);
        console.log(senha);
        var json = {'email':email, 'senha':senha};

     $.ajax({
            type:"POST", crossDomain: true, cache: false,
            url:"http://localhost/projeto/login.php",
            data:json,
            dataType:'json',
            sucess: function (data){
                console.log("logou");
                if(data=='logou'){
                    console.log("logou");
                    alert("logou");
                    window.location.href="inicial.html";
                }else{
                    alert ( " Obrigado " );
                }
            },
            error: function(e){
                console.log(e);
            }
        });
    }
    </script>
</head>
<body class='tela_login'>

    <script type="text/javascript" src="cordova.js"></script>
    <div class='form-group'>
        <form id='formulario' action=login.php method=post></form>
        <img src="/imagem/icone_login.png" class='img_login'">
        <p><input type=text class='form-login' id='email' placeholder='Insira seu email'></p>
        <p><input type=password class='form-login' id='senha' placeholder='Insira sua senha'></p>
        <button type=button class='btn-logar' onclick="Login()">Logar</button>
        <button type=submit class='btn-cadastrar'>Cadastrar</button>
        </div>
        <form>
    </div>

</body>
</html>

PHP

<?php
require "conexao.php";

$email=$_POST['email'];
$senha=$_POST['senha'];

$query=mysqli_query($conexao, "SELECT * FROM tbl_cliente where email='$email' and senha='$senha'");
$cont=mysqli_num_rows($query);
if($cont>0){
     echo "logou";
}else{ 
    echo "falhou";
}
?>

Help me, please.

    
asked by anonymous 02.11.2018 / 19:07

1 answer

0

I think it's because you indicate in the AJAX call that the return is of type JSON, but in PHP you do not return a JSON, but a text.

To solve the problem, insert the following statement at the beginning of your PHP code:

header('Content-Type: application/json');

And in return for your instruction, I suggest you do this:

echo json_encode(['status' => 'logou']);

We are transforming an array into JSON, with the native function json_encode() .

In JavaScript, you will test the return as follows:

if (data.status == 'logou') ...

In the same way in cases of failure and etc.

    
03.11.2018 / 02:13