.post dentro de jQuery.validator.addMethod siempre devuelve falso

Question

Soy muy nuevo en la programación de jQuery y Javascript. Tengo un programa a continuación que verifica si se toma el nombre de usuario o no. Por ahora, el script PHP siempre devuelve

if(isset($_POST["username"]))//&& isset($_POST["checking"])) 
    { 
     $xml="<register><message>Available</message></register>"; 
     echo $xml; 
    } 

La función de inicio de sesión funciona, pero la comprobación del nombre de usuario no. ¿Algunas ideas? Aquí está todo de mi código:

$(document).ready(function() { 
jQuery.validator.addMethod("checkAvailability",function(value,element){ 
    $.post("login.php" , {username:"test", checking:"yes"}, function(xml){ 
     if($("message", xml).text() == "Available") return true; 
     else return false; 
    }); 
},"Sorry, this user name is not available"); 
$("#loginForm").validate({ 
    rules: { 
     username: { 
      required: true, 
      minlength: 4, 
      checkAvailability: true 
     }, 
     password:{ 
      required: true, 
      minlength: 5 
     } 
    }, 
    messages: { 
     username:{ 
      required: "You need to enter a username." , 
      minlength: jQuery.format("Your username should be at least {0} characters long.") 
     } 
    }, 
    highlight: function(element, errorClass) { 
       $(element).fadeOut("fast",function() { 
       $(element).fadeIn("slow"); 
       }) 
    }, 
    success: function(x){ 
     x.text("OK!") 
    }, 
    submitHandler: function(form){send()} 
}); 
function send(){ 
    $("#message").hide("fast"); 
    $.post("login.php" , {username:$("#username").val(), password:$("#password").val()}, function(xml){ 
     $("#message").html($("message", xml).text()); 
     if($("message", xml).text() == "You are successfully logged in.") 
     { 
      $("#message").css({ "color": "green" }); 
      $("#message").fadeIn("slow", function(){location.reload(true);}); 
     } 
     else 
     { 
      $("#message").css({ "color": "red" }); 
      $("#message").fadeIn("slow"); 
     } 
    }); 
} 
$("#newUser").click(function(){ 

    return false; 
}); 

});

Answer 1

Es necesario utilizar la forma expandida de $.post() cuales es $.ajax() lo que puede establecer la opción async a falso, como esto:

jQuery.validator.addMethod("checkAvailability",function(value,element){ 
    $.ajax({ 
     url: "login.php", 
     type: 'POST', 
     async: false, 
     data: {username:"test", checking:"yes"}, 
     success: function(xml) { 
     return $("message", xml).text() == "Available"; 
     } 
    }); 
},"Sorry, this user name is not available"); 

Actualmente su función success que analiza la respuesta pasa después la validación termina, porque es una operación asincrónica. Por lo tanto, actualmente no devuelve nada en el momento en que se utiliza el valor de retorno, y undefined ~ = false, por lo que siempre aparece como falso. Al configurar async en false, está permitiendo que el código se ejecute en orden sin la devolución de llamada, por lo que la devolución en el ejemplo anterior se utiliza realmente.

Otra alternativa, si se puede ajustar la estructura de retorno de su página es usar el plugin de validación incorporado remote option, que es sólo para este tipo de cosas :)

Answer 2

Está bien, y trabajando ahora. Aquí está el código:

$(document).ready(function() { 
jQuery.validator.addMethod("checkAvailability",function(value,element){ 
var x= $.ajax({ 
    url: "login.php", 
    type: 'POST', 
    async: false, 
    data: "username=" + value + "&checking=true", 
}).responseText; 
if($("message", x).text()=="true") return true; 
else return false; 
},"Sorry, this user name is not available"); 
$("#loginForm").validate({ 
    rules: { 
     username: { 
      required: true, 
      minlength: 4, 
      checkAvailability: true 
     }, 
     password:{ 
      required: true, 
      minlength: 5 
     } 
    }, 
    messages: { 
     username:{ 
      required: "You need to enter a username." , 
      minlength: jQuery.format("Your username should be at least {0} characters long.") 
     } 
    }, 
    highlight: function(element, errorClass) { 
       $(element).fadeOut("fast",function() { 
       $(element).fadeIn("slow"); 
       }) 
    }, 
    success: function(x){ 
     x.text("OK!") 
    }, 
    submitHandler: function(form){send()} 
}); 
function send(){ 
    $("#message").hide("fast"); 
    $.post("login.php" , {username:$("#username").val(), password:$("#password").val()}, function(xml){ 
     $("#message").html($("message", xml).text()); 
     if($("message", xml).text() == "You are successfully logged in.") 
     { 
      $("#message").css({ "color": "green" }); 
      $("#message").fadeIn("slow", function(){location.reload(true);}); 
     } 
     else 
     { 
      $("#message").css({ "color": "red" }); 
      $("#message").fadeIn("slow"); 
     } 
    }); 
} 
$("#newUser").click(function(){ 

    return false; 
}); 
}); 

Answer 3

Bien, esto podría no ser tan relevante pero tuve un problema similar. No hice nada con el valor de retorno, simplemente lo devolví. Y siempre fue verdad. Entonces, después de hurgar, pensé que el valor del servidor aparecía como una cadena para el validador. Mientras no fuera una cadena vacía, volvería a ser verdad. Entonces la solución fue usar eval();

Un ejemplo:

jQuery.validator.addMethod("checkAvailability",function(value,element){ 
return eval($.ajax({ 
    url: "/check", 
    async: false, 
    data: { 
     field: $('#element').attr('name'), 
     val: value 
    } 
}).responseText); 
}, "error");