PGTable.Views.Table = Backbone.View.extend({
template: "app/templates/pgtable.html",
initialize: function(options) {
_.bindAll(this, 'render', 'remove');
this.model.bind('change', this.render);
this.model.bind('destroy', this.remove);
},
render: function(done) {
var view = this;
namespace.fetchTemplate(this.template, function(tmpl) {
view.el.innerHTML = tmpl();
$('ul', this.parentEl).append(view.el); // THIS is what I want to avoid...
});
},
remove: function() {
$(this.el).remove();
}
});
// This will fetch the tutorial template and render it.
PGTable.Views.Tables = Backbone.View.extend({
template: "app/templates/pgtables.html",
initialize: function(options) {
_.bindAll(this, 'render', 'addAll', 'addOne');
this.collection.bind('add', this.addOne);
},
render: function(done) {
var view = this;
// Fetch the template, render it to the View element and call done.
namespace.fetchTemplate(this.template, function(tmpl) {
$(view.el).html(tmpl());
// If a done function is passed, call it with the element
if (_.isFunction(done)) {
done(view.el);
}
view.addAll();
});
},
addAll: function() {
this.collection.each(this.addOne);
},
addOne: function(model) {
view = new PGTable.Views.Table({model: model});
view.parentEl = this.el;
view.render();
model.bind('remove', view.remove);
}
});