In your first view, ClubSelectView
on this line:
this.trigger("teamSelect:change", "Team selected from dropdown items");
"this" refers to ClubSelectView
. However, in your second view:
this.on("teamSelect:change", function (msg) {
alert("teamSelect:change " + msg); //never triggered
});
The "this" refers to MatchSelectView
. That means that it is listening for the event "teamSelect:change" on itself. But the event is not being fired on itself but on the first view. This is one of the main problems that Marionette - a plugin for Backbone - was meant to solve. It provides an Event Aggregator which is global to your entire application. All views can listen for events on the Aggregator and respond to them. In your current setup, you would have to get a reference to the second view from your first view ClubSelectView
and then trigger the event on that object, not on this
.