locked
WinJS listview updates only once

    Question

  • My listview updates with my data from webapi nicely the first time, but when requesting new data it does not update. I can see that the new data is returned so no problem there. I new to WinJS so forgive me is this is simple.
    Thanks

    function getJobs(q) {
        var p = new RemoteData().postData(root + "/api/jobs/GetNearActiveJobs", { query: q, kms: $("#near-km").val() });
        p.done(function completed(request) {
            var obj = JSON.parse(request.response);
            console.log(obj);
            WinJS.Namespace.define("Sample.ListView", { data: new WinJS.Binding.List(obj) });
            WinJS.UI.processAll();
        }, function error(request) {
                console.log(request);
            });
    }
        <div class="smallListIconTextTemplate" data-win-control="WinJS.Binding.Template" style="display: none">
            <div class="smallListIconTextItem">
                <div class="smallListIconTextItem-Detail">
                    <h4 data-win-bind="textContent: Description"></h4>
                    <p>
                        <span data-win-bind="textContent: Name"></span>
                        <span data-win-bind="textContent: State"></span>
                        <span data-win-bind="textContent: Postcode"></span>
                    </p>
                </div>
            </div>
        </div>
        <div id="listView"
             class="win-selectionstylefilled"
             data-win-control="WinJS.UI.ListView"
             data-win-options="{
                itemDataSource: Sample.ListView.data.dataSource,
                itemTemplate: select('.smallListIconTextTemplate'),
                itemsReorderable: true,
             selectionMode:'single',
             layout: { type: WinJS.UI.ListLayout } }">
        </div>



    Alan Mosley - ThatsIT Solutions

    Saturday, April 04, 2015 12:52 PM

Answers

All replies

  • Hi Alan,

    Have you tried to use ListView.itemDataSource property to set data source that provides the ListView with items?

    See https://msdn.microsoft.com/en-us/library/windows/apps/hh700703.aspx

    Also check this sample for details: https://code.msdn.microsoft.com/windowsapps/ListView-basic-usage-sample-fcc451db

    <div class="horizontalList win-selectionstylefilled"
                data-win-control="WinJS.UI.ListView" 
                data-win-options="{ 
                    itemDataSource: myData.dataSource, 
                    itemTemplate: smallListIconTextTemplate, 
                    layout: { type: WinJS.UI.ListLayout, orientation: WinJS.UI.Orientation.horizontal} 
                }"
            ></div>


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey.

    Monday, April 06, 2015 6:24 AM
    Moderator
  • isn't that what I was doing?

     <div id="listView"
             class="win-selectionstylefilled"
             data-win-control="WinJS.UI.ListView"
             data-win-options="{
                itemDataSource: Sample.ListView.data.dataSource,
                itemTemplate: select('.smallListIconTextTemplate'),
                itemsReorderable: true,
             selectionMode:'single',
             layout: { type: WinJS.UI.ListLayout } }">
        </div>


    Alan Mosley - ThatsIT Solutions

    Tuesday, April 07, 2015 3:57 AM
  • I tried using the example here ListView.itemDataSource but the same, it loads initially but dose not update.
    Thanks

    Alan Mosley - ThatsIT Solutions

    Wednesday, April 08, 2015 5:37 AM
  • I tried using the example here ListView.itemDataSource but the same, it loads initially but dose not update.
    Thanks

    Alan Mosley - ThatsIT Solutions


    Hi Alan,

    If you need to sync up the latest data in UI when the backend data has been changed, you need to add the Notification Protocol to make this work.

    The problem is that a standard JavaScript object doesn’t support any notification protocol to inform interested parties—such as a binding—that its data has changed. To add the notification protocol is a matter of calling the as method from the WinJS.Binding namespace.

    Please refer to this article to see how to add the Notification Protocol, just see Figure 6: https://msdn.microsoft.com/en-us/magazine/jj651576.aspx


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey.

    Wednesday, April 08, 2015 7:20 AM
    Moderator
  • Look9ing at this code it looks like some sort of observable, but in my example I am not changing the data items, I am getting a completely new list from a remote json call.
    Are we on the same page?
    Thanks

    Alan Mosley - ThatsIT Solutions

    Wednesday, April 08, 2015 8:30 AM
    • Marked as answer by Alan Mosley Monday, April 13, 2015 3:33 PM
    Monday, April 13, 2015 3:33 PM