diff --git a/src/view.js b/src/view.js
index b477b038..e1913d6f 100644
--- a/src/view.js
+++ b/src/view.js
@@ -206,7 +206,7 @@ my.DataTable = Backbone.View.extend({
// Core Templating
template: ' \
\
- \
+ \
\
{{#notEmpty}} | {{/notEmpty}} \
{{#headers}} \
@@ -219,39 +219,32 @@ my.DataTable = Backbone.View.extend({
\
{{/headers}} \
\
- {{#rows}} \
- \
- | \
- {{#cells}} \
- \
- \
- | \
- {{/cells}} \
-
\
- {{/rows}} \
- \
+ \
+ \
\
',
toTemplateJSON: function() {
var modelData = this.model.toJSON()
- modelData.rows = _.map(this._currentDocuments.models, function(doc) {
- var cellData = _.map(modelData.headers, function(header) {
- return {header: header, value: doc.get(header)}
- })
- return { id: 'xxx', cells: cellData }
- })
modelData.notEmpty = ( modelData.headers.length > 0 )
return modelData;
},
render: function() {
+ var self = this;
var template = $( ".dataTableTemplate:first" ).html()
, htmls = $.mustache(template, this.toTemplateJSON())
;
- $(this.el).html(htmls);
+ this.el.html(htmls);
+ this._currentDocuments.forEach(function(doc) {
+ var tr = $('
');
+ self.el.find('tbody').append(tr);
+ var newView = new my.DataTableRow({
+ model: doc,
+ el: tr,
+ headers: self.model.get('headers')
+ });
+ newView.render();
+ });
return this;
}
});
@@ -264,6 +257,7 @@ my.DataTableRow = Backbone.View.extend({
initialize: function(options) {
this._headers = options.headers;
this.el = $(this.el);
+ this.model.bind('change', this.render);
},
template: ' \
| \