How do I prevent the spine remove () from removing "el" in the view?
I want to delete a view before creating a new one. But my requirement is view.remove()
to remove the view, but not remove the item el
. Having said that, I don't want to install tagName
as it creates a new item which is not needed. Is there a way to remove the view from memory by freeing the content el
?
source to share
You can override the Backbone view method remove
in your abstract view:
remove: function() {
// this._removeElement();
this.$el.empty();
this.stopListening();
return this;
}
Default source code: http://backbonejs.org/docs/backbone.html#section-158
source to share
I've solved this before with a disposable booster.
make sure your html contains an anchor (class or id) for your one-time view:
<div class="content-container"></div>
then create LauncherView:
var LauncherView = Backbone.View.extend({
initialize: function(options) {
this.render();
},
render: function() {
this.$el.html(this.template());
return this;
},
// inner views will be bound to ".launcher-container" via
// their .el property passed into the options hash.
template: _.template('<div class="launcher-container"></div>')
});
then instantiate the one-time run view:
app.currentLauncherView = new LauncherView({});
and add it to your DOM anchor:
$('.content-container').append(app.currentLauncherView.el);
then you can create a view that will attach to the one-time launch view:
app.throwAway1 = new DisposableView({el: '.launcher-container'});
And then when you want to destroy that view, you can do it with
app.throwAway1.off();
app.throwAway1.remove();
app.currentLauncherView.remove();
Then you can create a new view by creating a new LauncherView, binding it to the DOM, and creating the next view, binding it to ".launcher-container".
app.currentLauncherView = new LauncherView({});
$('.content-container').append(app.currentLauncherView.el);
app.throwAway2 = new DisposableView({el: '.launcher-container'});
source to share