I have a Backbone system consisting of nested sub-views in which I occasionally need to do the following.
I do this by calling something like $(parent.el).html(...)
and then $(parent.el).append(child.el)
What I have always seen with this technique is that the event handlers on the child are lost. So I have tried a number of things, none of which have worked so far.
$.detach()
The only thing that works for me is completely rebuilding the child view from scratch. Does anyone have any ideas? Reattaching the existing node would be much more efficient.
Thanks!
I just had a similar problem. This seemed to work for me:
this.undelegateEvents();
this.$el.hide();
this.$el.detach();
// do whatever here
this.$el.appendTo(containerElement);
this.delegateEvents();
this.$el.slideDown('fast');
I'm still not exactly sure why the event listeners disappear, though I can confirm they are actually gone when I look in the Chrome developer tools window. It's strange, because Roatin Marth has an example (http://jsfiddle.net/Xcrhb/1) where this problem doesn't occur.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With