1

Debo realizar llamadas Ajax con parámetros dinámicos, utilizo el $.each para recorrer los valores de los parámetros y mandarlos a la llamada ajax pero al parecer se ejecutan al mismo tiempo, y deseo que se ejecute una después de otra, como es dinámico no tengo un número exacto de llamadas a Ajax, alguna idea?? Esto es lo que he intentado:

 $.each(params, function (index, value) {
                v1 = value.v1;
                v2 = value.v2;

                llamadoAjax(v1, v2);
            });

Donde llamadoAjax es:

var parametros = {
    v1: v1,
    v2: v2
}

$.ajax({
    url: "WebService/ws.aspx/Funcion",
    type: 'POST',
    dataType: 'json',
    contentType: 'application/json; charset=utf-8',
    data: JSON.stringify(parametros),
    destroy: true,
    success: function (result) {}
 });

Funciona muy bien pero... al parecer se realiza el llamado a ajax al mismo tiempo, alguna idea de como pausarlos??

1
  • en 2019 se puede usar un array de promesas, cuando todas resuelven se ejecuta una función ( o por cada respuesta de ajax una función y al final cuando todo resolvió otra función ) hay un ejemplo en es.stackoverflow.com/q/188799/81450 Commented el 8 jul. 2019 a las 0:10

2 respuestas 2

0

Ajax es una tecnología asíncrona, lo que significa que los datos adicionales se solicitan al servidor y se cargan en segundo plano sin interrumpir el comportamiento de la aplicación web. Sin embargo, es posible configurar las peticiones como síncronas de tal forma que la interactividad de la aplicación web se detiene hasta la respuesta por parte del servidor.

En tu caso, estás realizando las llamadas ajax de manera asíncrona(configurada por defecto), lo que significa que se realizan las llamadas y la ejecución continúa sin esperar una respuesta del servidor por cada una de ellas.

Para poder realizar algún proceso por cada respuesta a las llamadas, y así trabajarlas "una después de otra", debes configurar tus llamadas para que se realicen de manera síncrona estableciendo el parámetro async:false. Por ejemplo:

$.ajax({
    url: "WebService/ws.aspx/Funcion",
    type: 'POST',
    dataType: 'json',
    async:false
    contentType: 'application/json; charset=utf-8',
    data: JSON.stringify(parametros),
    destroy: true,
    success: function (result) {//Proceso por cada respuesta (result) a la llamada//}
 });
0

Yo utilizaría recursividad, ya que el uso de async:false no está recomendado según la propia documentación de jQuery.

Según tu ejemplo, así quedaría la función llamadoAjax():

function llamadoAjax(params, index) {
    // Estoy dando un poco por echo que esta es la estructura de tu array. 
    // Cambiala si fuera necesario
    var parametros = {
        v1: params[index].v1,
        v2: params[index].v2
    }

    $.ajax({
        url: "WebService/ws.aspx/Funcion",
        type: 'POST',
        dataType: 'json',
        contentType: 'application/json; charset=utf-8',
        data: JSON.stringify(parametros),
        destroy: true,
        invokedata: { params: params, index: index },
        success: function (result) {
            var 
                params = this.invokedata.params,
                index = this.invokedata.index;

            // Comprueba si hemos llegado al final del array.
            // Si no es asi, usamos recursividad para la siguiente iteración.
            if (params.length < index)
                llamadoAjax(params, index++);
            // Ha llegado al final del array. Finaliza el proceso.
            else
                console.log('Fin del proceso');
        }
     });    
}

Y para invocar al proceso, una llamada como cualquier otra. En este caso, el valor inicial de index será 0.

llamadoAjax(params, 0);

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.