AJAX does not update div by id

0

I am developing a login system, where I need to return the validation message to the user in a div on the login page itself, however the error message is appearing on the validation page. I am using Bootstrap and PHP with PDO

Login.php:

<!DOCTYPE html>
<html lang="pt-br">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1, maximum-scale=1, user-scalable=no" />



        <link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">


        <title>Login</title>
    </head>
<body>

<form id="loginform"  role="form" action="validaLogin.php" method="POST">

    <div class="form-group has-feedback">
               <label for="login" class="control-label">Login</label>

               <input type="text" 

               class="form-control" 
               id="inputLogin" 
               name="login" 
               placeholder="Insira seu login" 
               title="Insira seu Login" 
               required>

               <span class="glyphicon form-control-feedback" aria-hidden="true"></span>



          </div>

    <div class="form-group has-feedback">
               <label for="inputSenha" class="control-label">Senha</label>

               <input type="password" 

               class="form-control" 
               id="inputSenha" 
               name="senha" 
               placeholder="Insira sua senha" 
               title="Insira sua Senha" 
               required>

               <span class="glyphicon form-control-feedback" aria-hidden="true"></span>
               <div class="help-block with-errors" id="login-alert"><span id="mensagem"></span></div>
    </div> 



    <div class="form-group margin-top-pq">
        <div class="col-sm-12 controls">
            <button type="submit" class="btn btn-primary" name="btn-login" id="btn-login">
              Entrar
            </button>
        </div>
    </div> 


</form>
<script type="text/javascript" src="bower_components/jquery/dist/jquery.js"></script>
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="check.js"></script>
</body>
</html>

check.js:

The code below should return an error message in the div #message

<script >$('document').ready(function(){

  $("#btn-login").click(function(){
    var data = $("#loginform").serialize();

    $.ajax({
      type : 'POST',
      url  : 'Login.php',
      data : data,
      dataType: 'json',
      beforeSend: function()
      { 
        $("#btn-login").html('Validando ...');
      },
      success :  function(response){            
        if(response.codigo == "1"){ 
          $("#btn-login").html('Entrar');
          $("#login-alert").css('display', 'none')
          window.location.href = "selectPersonagem.php";
        }
        else if(response.codigo == "0"){     
          $("#btn-login").html('Entrar');
          $("#login-alert").css('display', 'block');
          $("#mensagem").html('<strong>Erro! </strong>' + response.mensagem);
        }
        }
    });
  });

});

validaLogin.php

On this page I do server side validation, blocking the ID after 5 error attempts, everything works, but instead of showing the error message on the login page, the error message appears in valida.php itself this way:

{codigo":"0","mensagem":"Usu\u00e1rio n\u00e3o autorizado, voc\u00ea tem mais 4 tentativa(s) antes do bloqueio!"}

In other words, it returns JSON, but in check.js it does not access its information.

This is one of the snippets of code that should return the message:

<?php
session_start();

// Constante com a quantidade de tentativas aceitas
define('TENTATIVAS_ACEITAS', 5); 

// Constante com a quantidade minutos para bloqueio
define('MINUTOS_BLOQUEIO', 30); 

// Require da classe de conexão
require 'conn.php';


// Dica 1 - Verifica se a origem da requisição é do mesmo domínio da aplicação
if (isset($_SERVER['HTTP_REFERER']) && $_SERVER['HTTP_REFERER'] != "http://localhost/loginphp/login.php"):
    $retorno = array('codigo' => 0, 'mensagem' => 'Origem da requisição não autorizada!');
    echo json_encode($retorno);
    exit();
endif;

I'm starting in ajax and PHP, I removed this code from this tutorial: tutorial

    
asked by anonymous 10.03.2018 / 10:35

0 answers