2

Estoy usando este tipo de envió de datos a través de jQuery.post, ¿En que lugar coloco una imagen de loading... o algún mensaje mientras devuelve algo la función?

$.post( "ajax/test.html", function( data ) {
  $( ".result" ).html( data );
});

2 respuestas 2

6

Es truco esta en usar ajaxStart y ajaxStop.

Estos eventos son invocados por jQuery cada vez que comienza/termina una solicitud ajax. Ya sea que se hagan por los métodos post, ajax, load, ..

Es muy util pues si hay varias solicitudes ajax en paralelo, el evento ajaxStop es invocado cuando termina la ultima solicitud . Y el evento ajaxStart no se repite si ya hay una solicitud en progreso.

$(function() {

  // tu elemento que quieres activar.
  var cargando = $("#cargando");

  // evento ajax start
  $(document).ajaxStart(function() {
    cargando.show();
  });

  // evento ajax stop
  $(document).ajaxStop(function() {
    cargando.hide();
  });

  // cualquier llamada ajax
  $.post("ajax/test.html", function(data) {
    $(".result").html(data);
  });
});
2

En el script que planteas la función es un callback y se ejecuta cuando suceda un evento (en este caso que el post termine), como vos lo querés hacer en ese momento alcanza con actuar fuera del callback.

$.post("ajax/test.html", function(data) {
  $(".result").html(data); // esto se ejecuta cuando el post termine
});
$(".result").html('loading'); // esto se ejecuta después de hacer el post

Si lo que necesitas es hacer esto para cualquier AJAX la respuesta de @rnd es mejor.

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.