Checking if login already exists via AJAX

Question

All right? I’m hoping that when you lose focus, the login field will go to the bank and look for an equal login. If there is, it means the guy has to use another and for that the return must be a mistake. If there is no login like his, nothing happens and he continues to register at will.

My code js is:

function checalogin() {
        $.ajax({
        url: 'ajax-insere.php?login=' + $('input[name=login]').val(),
        type: 'GET',
        });
}

And the php code is:

    if(isset($_GET['login']) && ($_GET['login'] != '')) {
    $txtLogin = $_GET['login'];    
    $checa_login = 'SELECT * FROM usuarios WHERE login LIKE "' . $txtLogin . '"';
    //echo $checa_login;
    $resposta = mysql_query($checa_login) or die(mysql_error());
    $value = mysql_fetch_assoc($resposta);
    if ($value['login'] == $txtLogin) { 
        header('Location:visualiza.php?loginExiste=1');        
    }
}

Note that the header returns with loginExiste=1. I created a condition in php that:

if(isset($_GET['loginExiste']) && $_GET['loginExiste'] == 1) {
   echo '<script>'.
       'Materialize.toast('Já existe um login igual a esse. Tente algodiferente.', 7000);'.
   '</script>';
}

However, when I lose focus, that is, onBlur, nothing happens. What I am doing wrong?

Thank you!

Answer 1

You are mixing PHP with Javascript in a "wrong" way. It is not wrong, but what awaits as a result is different from what will actually occur.

The location will only affect AJAX, but will not trigger PHP, for obvious reasons (PHP does not run in the client’s browser).

So what’s actually happening is:

AJAX -> ajax-insere.php?login=nome -> visualiza.php?loginExiste=1

The PHP that exists in visualiza.php has no impact on the page, it will only be the return of AJAX, so you should treat such return. So it is AJAX that receives the <script>'Materialize.toast('Já existe um login igual a esse. Tente algodiferente.', 7000);</script>. One solution is the .html(), this way will inject on the page the script, but I don’t find such an effective solution.

Best fix:

Javascript:

function checalogin() {
  $.getJSON('ajax-insere.php?login=' + $('input[name=login]').val(), function(json) {

    if (json['isValid'] === false) {
      Materialize.toast('Já existe um login igual a esse. Tente algo diferente.', 7000);
    }

  });

}

This way the/Oast alert will be displayed by AJAX itself, with a return of true/false from JSON.

PHP:

if(isset($_GET['login']) && !empty($_GET['login'])){

    $resposta = mysql_query('SELECT id FROM usuarios WHERE login = "' . mysql_real_escape_string($_GET['login']) . '"');
    $json['isValid'] = mysql_num_rows($resposta) > 0 ? false : true;

    echo json_encode($json);

}

This way PHP will return true/false if there is already a name EQUAL to the one typed by the user.

ATTENTION:

mysql_* is already obsolete (new versions no longer support this!) and it is not recommended to use it!

Answer 2

already tried to marry this Blur action using jQuery?

$("#IdDoCampoQueVaiDarBlur").blur( function(){
    checalogin();
});