Backbone.js : repopulate or recreate the view?

Question

In my web application, I have a user list in a table on the left, and a user detail pane on the right. When the admin clicks a user in the table, its details should be displ

Answer 1

This is a common condition. If you create a new view every time, all old views will still be bound to all of the events. One thing you can do is create a function on your view called detatch:

detatch: function() {
   $(this.el).unbind();
   this.model.unbind();

Then, before you create the new view, make sure to call detatch on the old view.

Of course, as you mentioned, you can always create one "detail" view and never change it. You can bind to the "change" event on the model (from the view) to re-render yourself. Add this to your initializer:

this.model.bind('change', this.render)

Doing that will cause the details pane to re-render EVERY time a change is made to the model. You can get finer granularity by watching for a single property: "change:propName".

Of course, doing this requires a common model that the item View has reference to as well as the higher level list view and the details view.

Hope this helps!