Programmatically determine Backbone.js .on callbacks?

Question

I'm trying to determine what function a Backbone.js model .on event is bound to. For example, given that I have a view with:

this.model.on('change', this.render, this);

I'd like to be able to programmatically determine that when there is a model change the render function will be called.

I've looked at Backbone.js source and it appears that the bindings are stored in the ._callbacks. In ._callbacks I can determine the event at which the model is bound to. From the above example I can determine that the model has the change event bound. However, is it possible to determine that the model is bound to the render function of the view?

For those curious, I am trying to extend the render function of a view, which I currently have working. However, when I extend/reassign the render function, it breaks the event bindings of the model.

Thanks!

Peter Lyons Peter Lyons · Accepted Answer · 2012-09-18T14:55:20

There are a few approaches to this. Yours should work, but you will have to manually disable the view's normal binding and add your own:

function renderMore() {
    //do your pre-render code
    view.render()
    //do your post-render code
}
model.off('change', view.render);
model.on('change', renderMore);

However, this is a pretty terrible code smell of poor encapsulation. Have you thought about subclassing your view and invoking the parent class's render method at the right time in your subclass?

I faced a situation where I wanted the ability to render a dialog as both a pure window with no extra look and feel elements as well as a jquery modal dialog with a title bar, close button, etc. I made the parent class responsible for rendering the basic content, and then I had mixins I could add to handle the jquery vs. vanilla variations.

Programmatically determine Backbone.js .on callbacks?

1 Answers