I am testing how a
layout can listen to its subviews's custom events.
I created a jsFiddle here where I have a
layout, 2 regions and I instantiated 2 ItemViews and showed them in the
layout's regions. The fiddle is in CoffeeScript.
<div id="region"></div>
<script id="layout-tmpl" type="text/_">
<h3>Heading</h3>
<div id="content"></div>
<div id="content2"></div>
</script>
<script id="item-tmpl" type="text/_">
<form>
<label>Firstname:</lable>
<input type="text" name="firstname" value="<%= firstname %>" />
<input type="button" value="Save" id="save" />
</form>
</script>
And the CoffeeScript is:
SimpleLayout = Backbone.Marionette.
Layout.extend
template: '#layout-tmpl'
regions:
main: '#content'
other: '#content2'
initialize: () ->
console.log @
onShow: () ->
_.each @.regionManagers, (region, name, something) =>
console.log region.currentView
# @.bindTo region.currentView, "custom:event", @callback
callback: () ->
alert "HELL YEAH"
SimpleItemView = Backbone.Marionette.ItemView.extend
template: "#item-tmpl"
events:
'click #save': 'save'
save: (evt) ->
evt.preventDefault()
@.trigger "custom:event"
region = new Backbone.Marionette.Region el: "#region"
layout = new SimpleLayout()
region.show
layout
layout.main.show new SimpleItemView model: (new Backbone.Model firstname: "Olivier")
layout.other.show new SimpleItemView model: (new Backbone.Model firstname: "Travis")
I want the
layout to listen to the ItemViews's custom events. In the onShow, I am looping through the region managers and trying to access the currentView object but it returns undefined.
If I attach the same event handlers outside of the SimpleLayout class and after I show the itemviews, then the
layout handlers the custom events properly.
Thanks for your help.
