Мне нужно отправлять по очередно несколько запросов к серверу на обмен данными по XMLHttpRequest обычно около 20, данные могут быть большой величины, по этому я разделяю их на несколько запросов, и есть у меня прогресбар, который я хочу обновлять по мере отправки данных и получения ответа от сервера делаю так:
блок с прогрес баром:
<div class="omi_progerscont"><span id="omi_impzago"></span><div id="omi_porgresbar"></div></div>
данные содержатся в массиве:
var sr = 0;
var zmet; //массив с данными
var alll = zmet.length;
var proc = Math.ceil(298/alll);// 298 это значение margin полоски прогресбара тут вычисляем на сколько пикселей её двигать при каждой отправке
increq (zmet,proc,sr,alll); //запускаем функцию отправки
var sr = 0;
И вот собственно сама функция отправки которая каждый раз если в массиве zmet остались ещё значения отправляет их ан сервер
function increq (zamet,proc,sr,alll) {
if (zamet.length != 0) {
var sendser = new XMLHttpRequest();
sendser.open('GET', 'http://***.***/hyst/acore.php?t=i&did='+zamet[0], false);
sendser.onload = function() {
var data = JSON.parse(sendser.responseText);
//тут кое какие операции с ответом с сервера
sr++
var curm = 298-(proc*sr); //используя переменные вычисляем сдвиг полоски прогрес бара
$('#omi_impzago').html('Экспорт ('+sr+' из '+alll+')');
$('#omi_porgresbar').html('<div class="omi_progerssbar"><div style="margin-left: -'+curm+'px;"></div></div>');
zamet.shift();//удаляем отправленный элемент данных из массива
increq (zamet,proc,sr,alll);//запускаем функцию снова
}
sendser.send();
} else {
$('.omi_progrbacgound').fadeOut();//если массив пуст скрываем прогресбар
}
}
всё работает отлично, но опытные люди уже догадались в чем проблема. Проблема в том что прогресс бар висит без изменений, до того момента пока все данные не отправятся на сервер, после же окончания отправки всех данных, он резко заполняется и скрывается. То есть по логике выполнение скрипта должно выполняться поэтапно, но выполняется сначала только та часть что отправляет данные, а в конце та часть которая касается визуализации. Как это делать что бы после каждой отправки данных и получения ответа шло обновление?
(делал то же самое через цикл foreach в начале - эффект был такой же, потом попробовал через функцию как тут думал так будет обновляться прогресбар)