javascript - Marionette.js CollectionView, only render specific models -


i refactoring backbone.js application use marionette.js, , trying wrap head around collectionview.

suppose have several itemviews model cow:

// declare models. var cow = backbone.model.extend({}); var cows = backbone.collection.extend({   model: cow });  // make views var grasspatch = marionette.itemview.extend({   tagname:  'div',   template: "<section class='grass'>{{name}}</section>", })  var pasture = marionette.collectionview.extend({});  // instantiate collectionview, var blissland = new pasture({   itemview: grasspatch; });  // now, add models collection. cows.add({   name: 'bessie',   hasspots: true });  cows.add({   name: 'frank',   hasspots: false }); 

now here's trick. want cows spots in pasture. how, in defining collectionview (pasture), tell pay attention models hasspots === true?

ideally have collectionview filter in events, minimally, how render itemviews based on model properties?

update

i used david sulc's examples , worked out easy solution. here's example implementation:

  this.collection = backbone.filtercollection(this.collection, function(criterion){     var len = string(criterion).length;     var = criterion.tolowercase();     return function(model){       var b = string(model.get('name')).substr(0, len).tolowercase();       if (a === b) {         return model;       }     };   });    this.collection.add({ name: 'foo' });   this.collection.add({ name: 'foosball' });   this.collection.add({ name: 'foo bar' });   this.collection.add({ name: 'goats' });   this.collection.add({ name: 'cows' });    this.collection.filter('foo');    // -> returns first 3 models 

as suggested others, best way achieve filter collection contain models want display, , pass fitlered collection collectionview rendering.

you can see working example here: http://davidsulc.github.io/marionette-gentle-introduction/#contacts filter contacts input field on top right display models containing text (e.g. "li").

this achieved using special collection type handles filtering: https://github.com/davidsulc/marionette-gentle-introduction/blob/master/assets/js/entities/common.js

and gets instantiated here: https://github.com/davidsulc/marionette-gentle-introduction/blob/master/assets/js/apps/contacts/list/list_controller.js#l13

this code book on marionette.


Comments

Popular posts from this blog

html - How to style widget with post count different than without post count -

How to remove text and logo OR add Overflow on Android ActionBar using AppCompat on API 8? -

javascript - storing input from prompt in array and displaying the array -