Witam
Chciałem zrobić tabelę z użytkownikami, zdefiniowałem dwa widoki. Jeden renderuje poszczególne wiersze (sub widok) i on działa poprawnie, a drugi ma renderować całą tabelę. Niestety przy renderowaniu w miejscu danych tabeli (wierszy) pojawia się informacja [object HTMLDivElement]. Korzystam z template dla całej tabeli bo chciałem ją wyrenderować i umieszczać dynamicznie na stronie na zmianę z innymi elementami
<script id="templateUsersList" type="text/template">
<div class="ui segments" >
<div class="ui clearing segment">
<table class="ui fixed single line celled table very compact striped selectable">
<thead>
<tr>
<th>Login</th>
<th>Imie i nazwisko</th>
</tr>
</thead>
<tbody><%= tbodyHTML %></tbody>
</table>
</div>
</div>
</script>
(function(){
App.Views.UsersList = Backbone.View.extend({
initialize : function(){
this.listenTo(this.collection, "sync", this.render);
},
tagName : "div",
template : _.template ($("#templateUsersList").html()),
render : function(){
this.collection.each(this.addModel, this);
html = this.template({tbodyHTML : this.el});
App.Regions.appEditDashboard.append(html);
return this;
},
addModel : function(user){
userView = new App.Views.UserItem({model : user});
this.$el.append( userView.render().el );
}
});
})();
<script id="template-user-item" type="text/template">
<td><%= username %></td>
<td><%= first_name + " " + last_name %></td>
</script>
(function(){
App.Views.UserItem = Backbone.View.extend({
tagName : "tr",
template : _.template($("#template-user-item").html()),
render : function(){
html = this.template( this.model.toJSON());
this.$el.append(html);
return this;
}
});
})();