Как принудительно обновить DOM при запуске нескольких задач Ajax в цикле

Question

У меня есть страница, которая отправляет электронные письма клиентам.Он имеет кнопку send all в нижней части страницы, чтобы обеспечить удобство отправки всех писем за один раз.Проблема в том, что он работает плохо или не работает вообще.Он либо не перерисовывает страницу, либо не обрабатывает все вызовы Ajax.

Вот JavaScript ...

function ajaxemail(element,name,email,bonus)
{
    if (window.XMLHttpRequest)
    {// code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp=new XMLHttpRequest();
    }
    else
    {// code for IE6, IE5
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }

    xmlhttp.onreadystatechange=function()
    {
        if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {

            document.getElementById(element).innerHTML= xmlhttp.responseText
            //document.getElementById(element).style.display = 'none'
            //document.getElementById(element).style.display = 'block'
            //alert(xmlhttp.responseText)
        }
    }
    xmlhttp.open("POST",<?php echo "\"$_SERVER[PHP_SELF]\"";?>,true);
    xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
    xmlhttp.send("emailto=true&name="+name+"&email="+email+"&bonus="+bonus);
}


function sendall(info)
{
    document.getElementById('sendallmails').disabled = true
    document.getElementById('sendallmails').value = 'Sending mails...'

    length = info.length

    for( i=0; i < length; i++)
    {
        ajaxemail(info[i][0],info[i][1],info[i][2],info[i][3])

    }

}

И если это поможет, вот где создается массив info, а затем функция с именем ...

echo "<script>\nvar email_info_array = new Array()\n";

    $j = 0;

    while($row = mssql_fetch_row($rs))
    {
            echo "email_info_array[$j] = new Array('sendlink$j','$row[1]','$row[2]','$row[4]')\n";

            ++$j;
    }

    echo "</script>\n\n";


    echo "<input type=\"button\" name=\"sendallmails\" id=\"sendallmails\" value=\"Send all Mails\"  onclick=\"javascript:sendall(email_info_array)\">\n";

Ошибка не в том, что страница вызывается функцией ajaxemail(), потому что она прекрасно работает при вызове один или по одному за раз.Когда он вызывается циклом, он не работает.Похоже, что он выполняет последние один или два элемента в цикле ... или он может сделать что-то промежуточное, если я сделаю что-то, что заставит браузер перерисовать (например, изменить его размер).оповещение как способ проверки того, что выполнение цикла по крайней мере работает, он успешно запускает вызов Ajax на каждой итерации (но мне нужно нажимать ok во многих оповещениях!

Мне нужно как-то принудительно обновитьDOM браузера на каждой итерации цикла. Неважно, станет ли страница менее отзывчивой (скорее, она не станет полностью не отвечающей)

Я тестирую в последнем Firefox (буду тестировать вдругие браузеры, когда он у меня работает в FF)

Answer 1

Проблема здесь в том, что вы используете асинхронные запросы с глобальной переменной, содержащей вызов Ajax.Вы просто перезаписываете предыдущий вызов на каждой итерации цикла.Вам нужно использовать библиотеку, которая не использует глобальную переменную для вызова Ajax.

Лучше всего использовать jQuery, Dojo, YUI или другие JavaScript-фреймворки, поддерживающие запросы Ajax.

Другой вариант - использовать массив для удержания ваших вызовов.основная идея, не делая всего этого

var ind = xmlhttp.push(new XMLHttpRequest()) - 1;

и

xmlhttp[ind].onreadystatechange ...
xmlhttp[ind].open ...