2

Hice mi validación de nombre de usuario en JSON & Ajax, el problema que tengo es que al estar vacío el input #username me da error en la consola. Lo que intentaba hacer es que al estar vacío el input oculte el texto del <span> pero no tuve éxito.

introducir la descripción de la imagen aquí

// Ajax code
$(function() {

    $('#username').on('keyup', function() {
        var username = $(this).val();

        $.ajax({
          url: '/templates/new/includes/ajaxrequest/register.php',
          method: 'get',
          data: {username: username},
          success: function(response){
            //const json =  JSON.stringify(response)
              response = JSON.parse(response);

              if(response.status == 'error'){
                $('span').text('Ups... El nombre de usuario está en uso.');
              }
              else{
              $('span').text('El nombre de usuario está disponible.');
              }
                  // Si el input está vacío, el contenido de <span> desaparece.
              console.log(response);
          }
        });
    });
});

// PHP code
    if(!empty($_GET['username'])){
        $username = $_GET['username'];

        $check = $dbh->prepare('SELECT username FROM users WHERE username = :username');
        $check->bindParam(':username', $username);
        $check->execute();

        if($check->rowCount() > 0){
            echo json_encode(['status'=>'error']);
        }
        else{
            echo json_encode(['status'=>'success']);
        }
    }

1 respuesta 1

3

Simplemente tienes que chequear que el valor de usuario no este vacio asi:

$(function() {

$('#username').on('keyup', function() {
    var username = $(this).val();

    if (username != '') {
    $('span').show();
    $.ajax({
      url: '/templates/new/includes/ajaxrequest/register.php',
      method: 'get',
      data: {username: username},
      success: function(response){
        //const json =  JSON.stringify(response)
          response = JSON.parse(response);

          if(response.status == 'error'){
            $('span').text('Ups... El nombre de usuario está en uso.');
          }
          else{
          $('span').text('El nombre de usuario está disponible.');
          }
              // Si el input está vacío, el contenido de <span> desaparece.
          console.log(response);
      }
    });
    } else {
        $('span').hide()
    }
});
});
1
  • 1
    Gracias amigo, tan fácil la solución y no la pensé jaja.
    – Snowstorm
    Commented el 30 ago. 2019 a las 17:17

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.