titanium TableRows are not inserted - titanium

Question

i'm getting a JSON response properly but my problem is with showing it. what's wrong with my code.
// this sets the background color of the master UIView (when there are no windows/tab groups on it)
Titanium.UI.setBackgroundColor('#000');
// create base UI tab and root window
var win1 = Titanium.UI.createWindow({
title : 'Main Window',
backgroundColor : '#fff'
});
var listUrl = "http://magadhena.com/test/list.php?FCODE=5&USERID=1";
var NumberOfLists = [];
var lists;
var tableData = [];
var table = Ti.UI.createTableView({
top : 40,
left : 10,
width : 300
});
var txt1 = Titanium.UI.createTextField({
top : 10,
left : 10,
width : 250
});
var button1 = Ti.UI.createButton({
top : 10,
left : 270,
width : 30
});
var xhr = Ti.Network.createHTTPClient();
xhr.setTimeout(3000);
xhr.onload = function() {
lists = eval('(' + this.responseText + ')');
for(var i = 0; i < lists.length; i++) {
var userId = lists[i].userid;
// The userID
var listId = lists[i].listid;
// The ListID
var listName = lists[i].listname;
// The ListName
var Object1 = new list(userId, listId, listName);
// Ti.API.log("Object is ",Object1.listId);
NumberOfLists.push(Object1);
// Ti.API.log("the size of the Json array is" , NumberOfLists.length);
}
};
xhr.open("GET", listUrl);
xhr.send();
for(var i = 0; i < NumberOfLists.length; i++) {
var row = Ti.UI.createTableViewRow({
title : NumberOfLists[i].listName
});
Ti.API.log("populating the data table ", NumberOfLists[i].toString);
tableData.push(row)
};
// Ti.API.log("the size of table data is ", tableData.length);
table.setData(tableData);
win1.add(table);
win1.add(txt1);
win1.add(button1);
// Opening Window1
win1.open();
///// List Objects
function list(userid, listid, listname) {
this.userId = userid;
this.listId = listid;
this.listName = listname;
}

Answer 1

You need to put table.setData() into xhr.onload function. Since you defined the code outside of the function, NumberOfLists is empty until xhr.onload function executed