winjs.xhr and function call in winjs - microsoft-metro

Question

Scenario: I am trying to call a webservice which returns the results in json, the logic should be very straight forward.
I call a webservice url in WinJS.xhr() add a then function to process the result, here i am trying to bind it to a list.
I am using the below but i am not getting anything displayed what am i doing wrong here?
Can some one tell me how to call a winjs.xhr() from a function and return some object which i can bind as i am trying below?
function getData() {
return WinJS.xhr({ url: "http://search.twitter.com/search.json?q=%23windows8&rpp=10" })
}
function myFunc() {
getData().then(function (xhr) {
var jsondata = JSON.parse(xhr.responseText)
return jsondata;
// ...do something with the data when it arrives...
}, function (err) {
// ...do something with the error
});
}
var dataList = new WinJS.Binding.List(myFunc());
//var dataList = new WinJS.Binding.List(dataArray);
var publicMembers =
{
itemList: dataList
};
WinJS.Namespace.define("DataExample", publicMembers);

Answer 1

The ctor for WinJS.Binding.List accepts a list or array as the initial contents of the list. Your myFunc() will return nothing. You can set up an empty list using
var dataList = new WinJS.Binding.List()
and export it as you currently do.
Then, in myFunc(), placed below the dataList declaration, you can just add items to the list. For example, assuming that jsondata parses into an array:
function myFunc() {
getData().then(function (xhr) {
var jsondata = JSON.parse(xhr.responseText)
jsondata.forEach(function(entry) { dataList.push(entry); });
}, function (err) {
// ...do something with the error
});
}
Edit: I also assume you have bound dataList.dataSource to the itemDataSource of a WinJS.UI.ListView and set a matching itemTemplate property or render function.