What is a good method for sending a message from a Child view to its parent Collection view in Backbone.js or Marionette.js?

Question

What is a good method for sending a message from a Child view to its parent Collection view in Backbone.js or Marionettejs?

Normally I send the message through the collection:

ChildView = Backbone.Marionette.ItemView.extend({
     send_message: function(){
          this.model.collection.trigger('some-message');
     }
})

ParentCollectionView = Backbone.Marionette.CollectionView.extend({
     // ON RENDER
     onRender: function(){
          this.listenTo(this.collection, 'some-message', this.do_something);
     }
     // DO SOMETHING
     do_something: function(){
          alert('did something');
     }
});

I think this is not right because:

• I'm sending the message from the child view, through the data, back to the parent view
• In this instance, the message does not relate to the data, its strictly message passing between views about view stuff
• The model could belong to more than one collection

Instead, I would like to send a message directly from a child view to its parent collection view. (actually, I'm using a composite view, not sure if that matters, wanted to keep the example simple though).

Belloc

Answer 1

Either have the child view directly emit the event and have the parent listen for it :

ChildView = Backbone.Marionette.ItemView.extend({
     send_message: function(){
          this.trigger('some-message');
     }
})

ParentCollectionView = Backbone.Marionette.CollectionView.extend({
     // ON RENDER
     onRender: function(){
          // no idea how Marionette references its children views
          // let's say this.subview is a reference to your child view 
          this.listenTo(this.subview, 'some-message', this.do_something);
     }

    // DO SOMETHING
     do_something: function(){
          alert('did something');
     }
});

Or use a dedicated event emitter you inject into your subview(s)

ChildView = Backbone.Marionette.ItemView.extend({
     send_message: function(){
          this.channel.trigger('some-message');
     }
})

ParentCollectionView = Backbone.Marionette.CollectionView.extend({
     initialize: function(){
          this.channel = _.extend({}, Backbone.Events); 
          this.listenTo(this.channel, 'some-message', this.do_something);
     },
     // ON RENDER
     onRender: function(){
          // pass the channel to the child
          // that probably should be done when the child is created
          this.subview.channel = this.channel;
     },
     // DO SOMETHING
     do_something: function(){
          alert('did something');
     }
});

Richter

Answer 2

Marionette has a handy function called triggerMethod that can send events from the child to the parent.

this.triggerMethod("someMethod", data1...)

That event is caught by the parent using an onChildview listener

onChildviewSomeMethod(childView, data1param, ...) {}

Jan