How can I force for cycle to wait for every XHR to be completed before it runs? I know a way which is in comment, but it kills real-time of percentage counter.
var data = new Array, per = 0;
WinJS.xhr({url : "http://index.hu/tech/rss"}).done(function(req){
$($.parseXML(req.response)).find("item title:lt(5)").each(function() {
data.push({
h : this.textContent
})
}).next().each(function(ind) {
WinJS.xhr({
url : this.textContent
}).done(function(req) {
per += 100 / 30;
$("#per").text(Math.ceil(per) + " %");
data[ind].p = req.response.match(/<p>(.+?)<\/p>/)[1]
})
/*var req = new XMLHttpRequest;
req.open("get", this.textContent, false);
req.onreadystatechange = function()
{
if(this.readyState == 4)
{
per += 100/30;
$("#per").text(Math.ceil(per) + " %");
data[ind].p = this.response.match(/<p>(.+?)<\/p>/)[1]
}
}
req.send()*/
})
for(var ind in data)
{
//console.log(data[ind].p)
}
})
You can just wait using setTimeout
. See line setTimeOut(wheAllDone, 100);
below:
var items = $($.parseXML(req.response)).find("item title:lt(5)").each(function()
{
data.push(
{
h : this.textContent
})
}).next();
var itemsCount = items.length;
var doneSoFarCount = 0;
items.each(function(ind)
{
WinJS.xhr(
{
url : this.textContent
}).done(function(req)
{
per += 100 / 30;
$("#per").text(Math.ceil(per) + " %");
data[ind].p = req.response.match(/<p>(.+?)<\/p>/)[1]
doneSoFarCount ++;
})
});
var wheAllDone = null;
wheAllDone = function() {
if(doneSoFarCount >= itemsCount)
{
for(var ind in data)
{
//console.log(data[ind].p)
}
} else {
setTimeOut(wheAllDone, 100); // <<<<< Wait a bit for all to complete
}
};
Instead of using a for loop for that, you could attach a callback function on the XHR request that checks if the stopping condition of the for loop is met, and then stops, or else makes the requisition one more time.