MarionetteJS - View Triggers
HTML
<script src="http://underscorejs.org/underscore.js"></script>
<script src="http://backbonejs.org/backbone.js"></script>
<script src="https://raw.github.com/marionettejs/backbone.marionette/master/lib/backbone.marionette.js"></script>
<div id="patches">
</div>
<script type="text/html" id="patchview">
<b><%=name%></b>
</script>
JavaScript
var App = new Marionette.Application();
App.addRegions({
"patches": "#patches"
});
App.on("initialize:after", function() {
Backbone.history.start();
});
App.module("Fiddle", function(Mod, App, Backbone, Marionette, $, _){
var PatchModel = Backbone.Model.extend({});
var PatchCollection = Backbone.Collection.extend({model: PatchModel});
var PatchView = Backbone.Marionette.ItemView.extend({
template:'#patchview',
triggers: {
"click b" : "do:something"
}
});
var PatchCollectionView = Backbone.Marionette.CollectionView.extend({
itemView: PatchView,
initialize: function() {
_.bindAll(this);
},
onAfterItemAdded: function(itemView){
console.log("item was added");
},
onRender: function(){
console.log("render");
}
});
patch0 = new PatchModel({name: "patch1"});
patch1 = new PatchModel({name: "patch2"});
patches = new PatchCollection();
patchesView = new PatchCollectionView({
collection:patches
});
// show the patches!
App.patches.show(patchesView);
patches.add(patch0);
patches.add(patch1);
patchesView.on("itemview:do:something", function() {
console.log('do something!');
});
});
App.start();