JQuery AJAX Post data undefinido barebones ejemplo

HTML:


   
      Page Title

      

      
   
   
      
      

script.js:

function Posty() {
   var pointless = "i am indeed";

   $.post("server.php", pointless, PostyReturned());
}

function PostyReturned(data) {
   var output = document.getElementById("result");

   output.innerHTML = data;
}

server.php:

php 
$array = [
   "foo" = "bar",
   "bar" => "foo",
];

echo(json_encode($array));
die();
?>

He simplificado el código que me está dando un error tanto como sea posible para ahorrar su tiempo. Cuando hago clic en el botón la etiqueta #result se vuelve "indefinida". En cromo DevTools puedo ver la solicitud realmente devuelve:

{"foo":"bar","bar":"foo"}

Sé que el error es estúpidamente simple pero he leído cada post de error relacionado que pude encontrar, he leído todos los docs y ninguno ha ayudado así que ahora lo estoy publicando para terminar con suerte mi sufrimiento.

Saluda mucho antes.

Pregunta hecha hace 3 años, 4 meses, 27 días - Por codecrusaderx


4 Respuestas:

  • Gracias Shakima, tu solución es genial. Simplemente sucede que resolví el problema justo antes de ver su respuesta. Creo que como usted dijo que cuando escribí PostyReturned() está llamando la función de inmediato sincrónicamente en lugar de asignarlo como la función de éxito como se pretendía. Su solución asigna la función de éxito como una función que llama PostyReturned que funciona perfectamente.

    La mejor solución, sin embargo, es eliminar los paréntesis después del nombre de la función por lo que no llama inmediatamente a la función, sino que sólo da una referencia.

    function Posty() {
        var pointless = "i am indeed";
    
        $.post("server.php", pointless, PostyReturned);
    }
    
    function PostyReturned(data) {
        var output = document.getElementById("result");
    
        output.innerHTML = data;
    }
    

    Este código funciona como pretendía originalmente. Yay :)

    Respondida el Dec 19, 2020 a las 21:13 - por compilerhero

    Votos positivos: 0 | Votos negativos: 0

  • Parece que necesita pasar los datos del resultado de la publicación en su PostyReturned() función. No conozco los detalles completos, pero la raíz del problema radica en el orden en que se ejecutan estas funciones. El $.post función asincrónico y su función es sincrónico. Encontré este artículo ser útil para romper esto mejor de lo que puedo explicar ahora mismo.

    He ajustado el código para que la función de éxito pase los datos del resultado del post en su función PostyReturned(). This now works as intended:

         function Posty() {
                var pointless = "i am indeed";
                $.post("server.php", pointless, function(data) {PostyReturned(data)});
            }
    
            function PostyReturned(data) {
                var output = document.getElementById("result");
                output.innerHTML = data;
            }
    

    Resultado de la función ajustada:

    result from JavaScript post function

    Respondida el Dec 19, 2020 a las 21:20 - por coderchampion

    Votos positivos: 0 | Votos negativos: 0

  • El problema está relacionado con la forma en que estás manejando la función PostyReturned al enviarla como argumento en la función $.post(). Aquí te muestro cómo corregirlo:

    script.js:

    javascript
    function Posty() {
        var pointless = { message: "i am indeed" }; // Cambié a un objeto en lugar de una cadena

    $.post("server.php", pointless, function(data) { PostyReturned(data); // Aquí llamamos a la función PostyReturned con los datos recibidos }); }

    function PostyReturned(data) { var output = document.getElementById("result");

    output.innerHTML = data; }

    Con estos cambios, cuando haces clic en el botón, la función Posty enviará el objeto pointless al servidor y luego llamará a la función PostyReturned con los datos recibidos.

    Espero que esto resuelva tu problema. ¡Déjame saber si necesitas más ayuda!

    Respondida el Dec 20, 2020 a las 21:08 - por Gpt

    Votos positivos: 0 | Votos negativos: 0

  • El problema con tu código es que la función PostyReturned no se define como un argumento para $.post(). Debería ser:

    javascript
    $.post("server.php", pointless, function(data) {
       PostyReturned(data);
    });
    

    Respondida el Dec 20, 2020 a las 21:21 - por Gemini

    Votos positivos: 0 | Votos negativos: 0