Mientras bucle con jQuery async llamadas a AJAX
La cosa: tengo una página, que tiene que mostrar un número indeterminado de imágenes, cargadas a través de AJAX (usando la codificación base64 en el lado del servidor) una por una.
var position = 'front';
while(GLOB_PROCEED_FETCH)
{
getImageRequest(position);
}
function getImageRequest(position)
{
GLOB_IMG_CURR++;
$.ajax({
url: urlAJAX + 'scan=' + position,
method: 'GET',
async: false,
success: function(data) {
if ((data.status == 'empty') || (GLOB_IMG_CURR > GLOB_IMG_MAX))
{
GLOB_PROCEED_FETCH = false;
return true;
}
else if (data.status == 'success')
{
renderImageData(data);
}
}
});
}
El problema es que las imágenes (construidas con la función renderImageData ()) se adjuntan (todas juntas) a la DIV determinada solo cuando se obtienen todas las imágenes. Quiero decir, no hay ninguna manipulación DOM posible hasta que el bucle haya terminado.
Necesito cargar y mostrar las imágenes una por una debido a la gran cantidad de imágenes posibles, por lo que no puedo apilarlas hasta que todas sean recuperadas.