Reputation: 5358
I'm writing a sample app using backbone.js.
On update of my model I re-render my view in this fashion
$('.target').html("");
$('.target').append(this.$el.html(this.template(model)))
Once the view is re-rendered after model update [on change event], events attached to the el
's children gets lost [doesn't seem to be like jQuery
live]. Is this a known issue or am I missing something? Should I try to replace html instead of append
? fiddle
Upvotes: 14
Views: 12809
Reputation: 35890
Once the view is in DOM, you don't need to keep removing and appending it. I think the simplest way to manage this is to remove the DOM insertion from the view altogether, and let the caller of view.render
to take care of it.
View:
render: function() {
this.$el.html(this.template(model));
return this;
}
Caller (on first render):
var view = new SomeView();
$('.target').append(view.render().el);
On subsequent renders:
view.render();
After the view has been rendered into DOM it can keep happily re-rendering itself without having to know anything about parent views. The event bindings should also stay intact between renders.
Upvotes: 11