0

Tengo una app en la que tengo una tabla con varias filas (unas 100). Para cada una de ellas necesito que se llame a una URL para registrar cierta información en un servidor externo. Cada llamada me devuelve si ha ido bien y un identificador necesario para la siguiente llamada. Es decir, las llamadas han de ser encadenadas (hasta que no tenga el resultado de la primera no puedo llamar a la segunda y así sucesivamente). Para ello, para no bloquear la app, desde un botón quiero que se abra una ventana modal en la que me indique el estado de cada llamada (por ejemplo, mostrar el ID de cada registro como el texto dentro de un span (id="item_x", siendo x el ID) y que pase de rojo a verde cuando termine su llamada).

Las llamadas secuenciales las estoy haciendo sin problemas con Ajax:

    ajaxRequest: function (urls) {
                if (urls.length > 0) {
                    $.ajax({ method: 'GET', url: urls.pop(), async:false })
                    .done(function (ok) {
                        if (ok) {
                          $('*[id*=item_]:visible.red').first().toggleClass('red green');
                          self.ajaxRequest(urls);
                        }
                    });
                }

El problema es que el color no cambia secuencialmente sino que cambia todo a la vez. Aunque las llamadas son secuenciales y se llama a toggleClass antes de la siguiente llamada, el cambio no se ve hasta que acaba la última llamada. ¿Es algo que se debe a jQuery? ¿Conocen alguna forma de resolver el problema?

Muchas gracias.

3
  • Tu código está mal implementado, por lo del modal y por creer que haciendo eso no bloqueas la app, y es que al hacer esto: async:false ya estás bloqueando el hilo principal. El problema tampoco está explicado claramente. ¿Tienes una especie de tabla ya con sus filas y puedes actuar sobre cada fila de esa tabla haciendo click en alguna parte? ¿O lo que quieres es ir llenando cada fila de la tabla en cada llamada? Parece que es más simple de lo que parece, pero no lo has explicado claro. Agrega a la pregunta también el HTML con el que trabaja tu código.
    – A. Cedano
    el 17 may. 2022 a las 8:27
  • Sí, parece que al final todo el problema radicaba en el async:false. En origen sí que lo tenía con async:true pero lo cambié con idea de esperar a la respuesta anterior para llamar a la siguiente.
    – erbihanka
    el 17 may. 2022 a las 16:10
  • No creo que necesites manejarlo de forma síncrona, ¿no es mejor, una vez se haga la primera petición, crear (o habilitar) desde el done la segunda fila y así sucesivamente?
    – A. Cedano
    el 17 may. 2022 a las 16:16

1 respuesta 1

0

Sí, tiene razón. Haciéndolo de forma asíncrona también he podido finalmente actualizar el contenido de la ventana modal de forma secuencial.

Para que quede más claro, la tabla está implementada con jQuery Datatables y no se interactua con cada fila. Tengo un botón externo a la tabla que cuando se clicka se leen todos los IDs de la tabla, se genera el conjunto de URLs (una diferente para cada ID) y se llaman secuencialmente. En la ventana modal muestro el estado de cada llamada (por si alguna falla para saber en cual ha sido). Cuando todo ha ido bien todos los estados se muestran en verde. Al cerrar la ventana modal se recarga la tabla con las mismas filas de la tabla pero con una columna actualizada con información que ha traído cada URL.

Gracias por su ayuda.

Tu Respuesta

Al pulsar en “Publica tu respuesta”, muestras tu consentimiento a nuestros términos de servicio, política de privacidad y política de cookies

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.