Skip to content

Instantly share code, notes, and snippets.

@jhirn
Last active December 26, 2015 13:49
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save jhirn/7160811 to your computer and use it in GitHub Desktop.
Save jhirn/7160811 to your computer and use it in GitHub Desktop.
App.Views.List = Backbone.View.extend({
initialize: function() {
_.bindAll(this);
this.render();
},
render: function() {
var t = this;
this.$el.empty();
this.collection.each(function(item){
var component = new App.Views.ListItem({ model: item });
t.$el.append(component.render());
});
},
});
App.Views.ListItem = Backbone.View.extend({
template: JST['path/to/template'],
events: {
'click .delete': 'deleteIt',
'click .spam': 'flagForSpam',
'click .praise': 'praiseItem'
},
initialize: function() {
_.bindAll(this);
},
render: function() {
//important to return the $el, so the parent may append it.
return this.$el.html(t.template({model: this.model});
},
deleteIt: function(){...},
flagForSpam: function(){...},
praiseItem: function(){...}
});
//Create the view, probably in your server side template
var myView = new App.Views.List({
el: "#super-sweet-list",
collection: new App.Collections.ThingsToRender([{...},{...}])
});
App.Views.MyView = Backbone.View.extend({
template: JST['path/to/template'],
initialize: function() {
_.bindAll(this); //Ignore this for now =)
this.render();
},
render: function() {
this.$el.html(this.template({
collection: this.collection
}));
},
});
//Create the view, probably in your server side template
var myView = new App.Views.MyView({
el: "#some-div-to-render-to",
collection: new App.Collections.ThingsToRender([{...},{...}])
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment