Devolución de la respuesta de una llamada Jquery AJAX

Question

He escrito una función, que tiene que comprobar si se ha tomado o no un nombre de usuario. Ahora cuando llamo a la función desde otra función, y le aviso su valor de retorno:

 alert(checkusernameavailable('justausername'));

dice 'indefinido'. He buscado alto y bajo, pero no puedo encontrar lo que estoy haciendo mal. Supongo que debería devolver el php-echo en check.php, pero no es así. Aquí está la función que escribí:

var checkusernameavailable = function(value) { 
    $.ajax({ 
     url: "check.php", 
     type: "POST", 
     async: false, 
     cache: false, 
     data: "username=" + value + "", 

     success: function(response) { 
     alert(response); 
     return response;   
     }, 
     error: function() { 
     alert('ajax error'); 
     } 
    }); 
    }

¿Qué estoy haciendo mal?

Answer 1

Las llamadas AJAX son asíncronas, lo que significa que solo devuelven datos una vez que se ha completado la operación. Es decir. el método checkusernameavailable nunca devuelve ninguna información (a menos que usted lo indique dentro de ese método). Que tiene que hacer lo siguiente:

// Just fire and forget the method 
checkusernameavailable("userName"); 

// Change the success function to do any display you require 
success: function(response) { 
    alert(response); 
    $("#SomeDiv").html(response);  
    }, 

El método dispara el método asíncrono AJAX que los puestos a check.php. Cuando se recibe la respuesta, usted maneja esa respuesta en la función asociada con la exitosa devolución de llamada de $.ajax. Puede especificar una función directa a la devolución de llamada de éxito, así:

// Change success to point to a function name 
success: foo 

// Create a function to handle the response 
function foo(response) 
{ 
    // Do something with response 
} 

EDIT:

De acuerdo con el comentario de la OP, necesita cambiar su llamada AJAX para ser sincrónica, en lugar de asíncrono (I nunca he hecho una llamada sincrónica como esto a mí mismo, así que esto no se ha probado):

var ajaxResponse; 

$.ajax({ 
    async: false, 
    success : function (response) 
       { 
        ajaxResponse = response; 
       }, 
    // other properties 
}); 

return ajaxResponse; 

API completa lista here.