javascript - How to properly use Backbone views and router -

i have sequence of page states mimic shopping cart checkout process so:

var itemscollection = backbone.collection.extend({     model: itemmodel,         url "/items"  });  var itemsview = backbone.view.extend({     // select item on click event here });  var itemsapp = backbone.view.extend({     // fetch collection of items , render each itemsview  }); 

when item selected, wanted change state render sellers of item. architecture this:

var sellerscollection = backbone.collection.extend({     model: sellersmodel,         url "/sellers" // item id stored in session not in url (so permalinks work)  });  var sellersview = backbone.view.extend({     // select item on click event here });  var sellersapp = backbone.view.extend({     // fetch collection of sellers , render each sellersview  }); 

so given these 2 states, based place instantiate sellers collections, fetch sellers , render view?

i thinking of combining sellersapp view , itemsapp view 1 serving sort of controller determines subview render , collection fetch. if way, should instantiate both collections in main app namespace , fetch collections when needed or should instantiate each collection when corresponding state (url) called. think latter approach violates law of demeter.

how think should it.

// 1. instantiate outside view var mainapp  = backbone.view.extend({       attributes: {          "page": "items"      },       items: function(){         // fetch items collection , render view (listento used in initialize)      },       sellers: function() {           // fetch sellers      }  });  items = new itemscollection; sellers = new sellerscollection; 

is approach? if approach, should tell mainapp change states - i.e. should explicitly invoke main app's fetch collection method (i.e.
in itemsview 'click' event, explicitly declare itemsapp.sellers) or should use listener on main app view automatically listens item selected.

i'm looking alternative use router.navigate - trigger , using router instantiate each view/collection i've heard not practice.

unfortunately backbone (especially backbone views) there's not "proper" way things. there's no reference convention. lot of people use backbone use models/collections , don't use views @ all.

in opinion scrap having view collection unless it's doing important. use hierarchy app > modelcollection+modelviewcollection.

so in case:

itemsapp (backbone.view) --itemcollection (backbone.collection)   --item (backbone.model)     -- sellercollection (backbone.collection) --itemviewcollection (array)   --itemview (backbone.view)     -- sellerviewcollection (array) 

so itemsapp create , destroy itemviews itemcollection changes (listen events).

the itemview responsible know when user selects based on event. can choose populate sellercollection on model when selected. when unselected clear collection. listens changes in sellercollection , adds , removes views each seller.

i don't think there's built-in method store list of backbone.views, want create own array. it's keep track of views, since model shouldn't have reference view.

it's worth having global event object act sort of messaging system. backbone.view implements backbone.events can declare app object globally , listen events. should use when need though, otherwise should listen events directly instead of triggering them globally. example, itemview may have "back" button raises event on called "back", while appview listening events on the active itemview , when wants go appview make necessary changes dom , de-select item.