winjs - Nested ListView or Nested Repeater -


i trying created nested repeater or nested list view using winjs 4.0, unable figure out how bind data source of inner listview/repeater.

here sample of trying (note control repeater, prefer):

html:

<div id="mylist" data-win-control="winjs.ui.listview">         <span data-win-bind="innertext: title"></span>                   <div data-win-control="winjs.ui.listview">         <span data-win-bind="innertext: name"></span>                 </div> </div> 

js:

var mylist = element.queryselector('#mylist).wincontrol; var mydata = [       {           title: "line 1",           items: [               {name: "item 1.1"},               {name: "item 1.2"}           ]       },       {           title: "line 2",           items: [               {name: "item 2.1"},               {name: "item 2.2"}           ]       }       ];    mylist.data = new winjs.binding.list(mydata); 

when try this, nothing renders inner list. have attempted trying use answer nested repeaters using table tags , 1 winjs: nested listviews still seem have same problem , hoping little less complicated (like knockout).

i know mentioned winjs doesn't support nested listviews, seems few years ago , hoping still not issue.

update

i able nested repeater work correctly, kraig's answer. here code looks like:

html:

<div id="mytemplate" data-win-control="winjs.binding.template">    <div       <span>bucket:</span><span data-win-bind="innertext: name"></span>       <span>amount:</span><input type="text" data-win-bind="value: amount" />       <button class="removebucket">x</button>       <div id="bucketitems" data-win-control="winjs.ui.repeater"           data-win-options="{template: select('#mytemplate')}"           data-win-bind="wincontrol.data: lineitems">       </div>    </div> </div> <div id="budgetbuckets" data-win-control="winjs.ui.repeater"    data-win-options="{data: data.buckets,template: select('#mytemplate')}"> </div> 

js: (after "use strict" statement)

winjs.namespace.define("data", {         buckets: new winjs.binding.list([             {                 name: "a",                 amount: 5,                 lineitems: new winjs.binding.list( [                         { name: 'test item1', amount: 50 },                         { name: 'test item2', amount: 25 }                     ]                 )             }         ])     }) 

*note answers part of question, however, after repo call , set repeater data source programmatically. going keep working towards , if post accepted answer.

the html repeater control sample windows 8.1 has example in scenario 6 nested repeater, , in case repeater created through template control. that's place start. (i discuss sample in chapter 7 of programming windows store apps html, css, , javascript, 2nd edition, starting on page 372, or 374 nested part.)

should still work winjs 4, though haven't tried it.


Comments

Popular posts from this blog

yii2 - Yii 2 Running a Cron in the basic template -

asp.net - 'System.Web.HttpContext' does not contain a definition for 'GetOwinContext' Mystery -

mercurial graft feature, can it copy? -