Backbone.js: bind/unbind events across views

Question

I am using the event aggregator pattern by Derick Bailey where he has illustrated the pattern in which an object manages the raising of events and the subscribers for those events.

It was all working fine where I was triggering events in one view and subscribing to them in other. The problem came when two or more views subscribe to an event and then at the time of discarding a view, one of the view unsubscribes from the event. This causes all the other views to be unsubscribed from the event as well.

Is there some workaround for this?

Update

Here is the a little bit of code that I'm using in my view:

var EventAggregator = _.extend({}, Backbone.Events);
new MyView({
    collection: MyCollection,
    eventagg: EventAggregator
});
MyView = Backbone.View.extend({
    initialize: function() {
        _.bindAll(this, 'render', 'close', 'actionFnc');
        this.childviews = [];
        this.options.eventagg.bind('evt:action', this.actionFnc);
        this.render();
    },
    render: function() {
    },
    close: function() {
        _(this.childViews).each(function(childview) {
            childview.close();
        });
        $(this.el).empty();
        this.options.eventagg.unbind('evt:action');
    },
    actionFnc: function() {
        // do something over here
    }
});

Can you share some code? Specifically, how you are discarding the view and whether you are overriding the base view.remove(). — timDunham
@timDunham - i edited the question. I am not overriding the view.remove() method. — vikmalhotra

timDunham timDunham · Accepted Answer · 2011-11-18T16:25:01

change the following line:

this.options.eventagg.unbind('evt:action');

to

this.options.eventagg.unbind('evt:action', this.actionFnc);

Backbone.js: bind/unbind events across views

1 Answers