I try to bind data but WinJS.xhr doesn't work

Question

Could someone tell me why WinJS.xhr doesn't work ??

(function () {
    "use strict";

    var dataArray = [];

    var title, description, link, pubDate, aa;

    var urlText = "http://breakingnews.nationchannel.com/home/mobile_api/news.php?catcode=NNC&itemid=&format=xml&goback=";
    //  var uri = new Windows.Foundation.Uri(urlText);

        WinJS.xhr({ url: urlText }).then(function (xml) {

            var restXML = xml.responseXML;
            var items = restXML.selectNodes("/news/item");

            for (var j = 0 ; j < items.length ; j++) {
                var item = items[j];

                title = item.selectSingleNode("title").text;
                description = item.selectSingleNode("description").text;
                link = item.selectSingleNode("link").text;
                pubDate = item.selectSingleNode("pubDate").text;

                dataArray[j] = { title: title, description: description, link: link, pubDate: pubDate };
            }
        });

        dataArray[12] = { title: "Aaaa", description: "GGG" };

    var dataList = new WinJS.Binding.List(dataArray);

    var publicMembers =
        {
            itemList: dataList
        };
    WinJS.Namespace.define("DataExample", publicMembers);

})();

HTML>-------------------

<div id="mediumListIconTextTemplate" data-win-control="WinJS.Binding.Template">
        <div style="width: 150px; height: 100px;">

            <!-- Displays the "picture" field. -->
            <div>

                <!-- Displays the "title" field. -->
                <h4 data-win-bind="innerText: title"></h4>

                <!-- Displays the "text" field. --> 
                <h6 data-win-bind="innerText: description"></h6>
            </div>
        </div>
    </div>       

    <div id="basicListView" data-win-control="WinJS.UI.ListView" 
        data-win-options="{itemDataSource : DataExample.itemList.dataSource, itemTemplate: select('#mediumListIconTextTemplate'),layout: {type: WinJS.UI.ListLayout}}">
    </div>

Thanks

                    

Answer 1

There are a couple of things you need to do:

1. Add your items from the xhr routine to the dataList using the push method.

Change:

dataArray[j] = { title: title, description: description, link: link, pubDate: pubDate };

to

dataList.push({ title: title, description: description, link: link, pubDate: pubDate });

2. Add a WinJS.UI.processAll(); at the end.

Try this:

(function () {
    "use strict";
    var dataArray = [];

    var title, description, link, pubDate, aa;

    var urlText = "http://breakingnews.nationchannel.com/home/mobile_api/news.php?catcode=NNC&itemid=&format=xml&goback=";
    //  var uri = new Windows.Foundation.Uri(urlText);

    WinJS.xhr({ url: urlText }).then(function (xml) {

        var restXML = xml.responseXML;
        var items = restXML.selectNodes("/news/item");

        for (var j = 0 ; j < items.length ; j++) {
            var item = items[j];

            title = item.selectSingleNode("title").text;
            description = item.selectSingleNode("description").text;
            link = item.selectSingleNode("link").text;
            pubDate = item.selectSingleNode("pubDate").text;

            dataList.push({ title: title, description: description, link: link, pubDate: pubDate }); //<---Change
        }
    });

    var dataList = new WinJS.Binding.List(dataArray);

    var publicMembers =
         {
             itemList: dataList
         };
    WinJS.Namespace.define("DataExample", publicMembers);

    WinJS.UI.processAll(); //<---------Add this

})();

Answer 2

Just to add two notes:

1. For the last promise in a chain (or a single promise), use .done instead of .then. This makes sure that exceptions inside the promise don't get swallowed in case there is a problem with the xhr call.

2. Along the same lines, it's a good practice to include an error handler with then/done so you can see the exact nature of errors if they happen.

.Kraig

Answer 3

Thanks a lot . I'll try it.

Answer 4

restXML.selectNodes(

"/news/item") gives an error of "Object doesn't support property or method 'selectNodes' "

Answer 5

This is a very old post.  Release preview changed the type that gets returned.  You need to construct an XmlDocument object from the XHR return value:

http://msdn.microsoft.com/en-us/library/windows/apps/windows.data.xml.dom.xmldocument.aspx

-Jeff

---

Jeff Sanders (MSFT)