Mediator with Backbone 0.9.10

mediatorExample.md

The Mediator pattern enables communication (mediation) between views using a mediator object.In the latest version of Backbone, the Backbone object itself can be used as a mediator without the need of a seperate helper.

In the following example, triggerSomething in our ToolbarView uses the global event-bus on the Backbone object to broadcast an application wide event somethingHappened with data.

// First view
var ToolbarView = Backbone.View.extend({
  className: ".toolbar",
  events: {
    "click .button":   "triggerSomething"
  },
  
  triggerSomething: function(){
    Backbone.trigger('somethingHappened', { id: 2 });  
  },
  render: function() {
    ...
  }
});

In TableView, we then subscribe to the global somethingHappened event in our view initialization using Backbone.on(), executing some behavior whenever we are notified of a change. We are able to similarly unsubscribe in our view destruction using Backbone.off():

// Second view
var TableView = Backbone.View.extend({
    
    initialize: function () {
        Backbone.on('somethingHappened', onSomething);
    },
    
    render: function(){
      // ...  
    },
    destroy: function () {
        Backbone.off('somethingHappened', onSomething);
    },

    // Action when something happens.
    onSomething: function (data) {
        console.log('Received:' + data.id);
    }
});

The more recent listenTo method may also be used for the same purpose.