Pregunta ¿Cómo puedo saber si jQuery tiene pendiente una solicitud de Ajax?


Tengo algunos problemas con el control jQuery que hicimos. Supongamos que tiene una lista desplegable que le permite ingresar el ID del artículo que está buscando, y cuando presiona ENTRAR o pierde el foco en un cuadro de texto, valida a través de jQuery que el ID que ingresó es correcto, mostrando una alerta si no lo hace 't.

El hecho es que cuando un usuario ordinario ingresa un valor no válido en él y pierde el foco al presionar el botón de enviar, la publicación de jQuery vuelve después de que se haya enviado el envío del formulario.

¿Hay alguna forma de que pueda verificar si jQuery procesa alguna solicitud Async para que no permita el envío del formulario?


73
2017-11-30 22:37


origen


Respuestas:


Podrías usar ajaxStart y ajaxStop para realizar un seguimiento de cuándo las solicitudes están activas.


32
2017-11-30 23:05



$.active devuelve la cantidad de solicitudes Ajax activas.

Más información aquí


197
2017-10-19 19:11



 $(function () {
        function checkPendingRequest() {
            if ($.active > 0) {
                window.setTimeout(checkPendingRequest, 1000);
                //Mostrar peticiones pendientes ejemplo: $("#control").val("Peticiones pendientes" + $.active);
            }
            else {

                alert("No hay peticiones pendientes");

            }
        };

        window.setTimeout(checkPendingRequest, 1000);
 });

23
2017-12-28 03:21



La función $ .ajax () devuelve un objeto XMLHttpRequest. Almacene eso en una variable que sea accesible desde el evento "OnClick" del botón Enviar. Cuando se procesa un clic para enviar, compruebe si la variable XMLHttpRequest es:

1) nulo, lo que significa que aún no se ha enviado ninguna solicitud

2) que el valor de ReadyState es 4 (Cargado). Esto significa que la solicitud ha sido enviada y devuelta con éxito.

En cualquiera de esos casos, devuelva verdadero y permita que el envío continúe. De lo contrario, devuelve false para bloquear el envío y dale al usuario alguna indicación de por qué su envío no funcionó. :)


10
2017-11-30 22:55



Tenemos que utilizar $ .ajax.abort () método para abortar la solicitud si la solicitud está activa. Esta promesa usa el objeto ReadyState propiedad para verificar si la solicitud está activa o no.

HTML

<h3>Cancel Ajax Request on Demand</h3>
<div id="test"></div>
<input type="button" id="btnCancel" value="Click to Cancel the Ajax Request" />

Código JS

//Initial Message
var ajaxRequestVariable;
$("#test").html("Please wait while request is being processed..");

//Event handler for Cancel Button
$("#btnCancel").on("click", function(){
if (ajaxRequestVariable !== undefined)

if (ajaxRequestVariable.readyState > 0 && ajaxRequestVariable.readyState < 4)
{
  ajaxRequestVariable.abort();
  $("#test").html("Ajax Request Cancelled.");
}
});

//Ajax Process Starts
ajaxRequestVariable = $.ajax({
            method: "POST",
            url: '/echo/json/',
            contentType: "application/json",
            cache: false,
            dataType: "json",
            data: {
        json: JSON.encode({
         data:
             [
                            {"prop1":"prop1Value"},
                    {"prop1":"prop2Value"}
                  ]         
        }),
        delay: 11
    },

            success: function (response) {
            $("#test").show();
            $("#test").html("Request is completed");           
            },
            error: function (error) {

            },
            complete: function () {

            }
        });

1
2017-09-14 08:30