locked
First item in FlipView became undefined

    Question

  • Good day.

    I have a simple templat, FlipView control and simple array for source data.

    <div id="flipViewTemplate" data-win-control="WinJS.Binding.Template">
    	<p data-win-bind="innerText: picture"></p>
    </div>

    <div data-win-control="WinJS.UI.FlipView"

    data-win-options="{itemDataSource: model.array.dataSource, itemTemplate: select('#flipViewTemplate') }" id="flipView"></div>

    model.array = [{picture: "data"}, …, {picture: "dataN"}];
    The problem is when I assign a template to FlipView, first item get undefined data. If there is no template it shows data correctly.

    Friday, April 5, 2013 9:23 AM

Answers

  • What is "model"? Can you share your entire repro project? I cannot repro the problem with the following HTML/JS. I see the flipview start with the mint image followed by strawberry and vanilla.

    HTML:
    =====
                <div id="flipViewTemplate" data-win-control="WinJS.Binding.Template">
                 <img data-win-bind="src: picture"></img>
                </div>

                <div style="width:400px;border:dashed" data-win-control="WinJS.UI.FlipView"
                 data-win-options="{itemTemplate: select('#flipViewTemplate')
                }" id="flipView"></div>
    JS:
    ====
                var myFlipView = document.getElementById("flipView").winControl;
                var testobj = [{ picture: "images/60mint.png" }, { picture: "images/60strawberry.png" }, { picture: "images/60vanilla.png" }];
                var flipList = new WinJS.Binding.List(testobj);
                myFlipView.itemDataSource = flipList.dataSource;

    Thanks,

    Prashant.


    @prashantphadke || Windows Store Developer Solutions #WSDevSol || Want more solutions? See our blog! http://aka.ms/t4vuvz

    • Marked as answer by Song Tian Thursday, April 11, 2013 11:06 AM
    Friday, April 5, 2013 10:33 PM
    Moderator