backbone.js - Rendering Multiple Collections into Region with Backbone Marionette -

i've started trying out marionette after building couple of vanilla backbone applications. right out of gate i'm running questions region management , multiple collections.

i have following nested model , collection structure

fooscollection    foomodel       barscollection          barmodel 

i want take advantage of great views , layout/region managers marionette provides. however, need render information on page in bit of unique way. html looks this:

<div id="container">      <div id="foos-description"></div>      <div id="bars-list"></div> </div> 

basically, high level information each of foomodels needs rendered foos-description element. then, each barscollection needs rendered bars-list. structure needs such list directly below corresponding information in foos-description container.

so, love use compositeviews solve this, looks view/dom element structure needs nested in same way collection/model structure nested, won't work in case.

i've added 2 regions

app.addregions({   foosdescription: "#foos-description",   barslist: "#bars-list" }); 

my initializer code looks this

app.addinitializer(function (options) {     app.fooscollection = new fooscollection(options.foos, {bars: options.bars});     app.foosdescription.show(new foosview({collection: app.fooscollection}));     app.fooscollection.each(function(f) {         app.barslist.show(new barsview({collection: f.barscollection}));     })  }); 

obviously show last barscollection in barslist region, i'm unsure of how should structure such each collection appended region. appreciated.

you'll need show view in region:

// tweaked region , view names clarification app.foosdescriptionregion.show(foosdescriptionview);