0

Desired output :

  <script id="table-template" type="text/html">
      <table>
        <thead>
           ADD THE HEADER NAMES HERE DYNAMICALLY,
        </thead>        
        <!-- insert collection items -->
        <tbody></tbody>
      </table>
    </script>

I am trying to get the above template generated, the problem here is the header names

Portfolio Amount Exchange Amount in Fccy Quantity Account

like the above it would be the fixed one, the user can give any number of header names.

This is the Code i have done : 

Grid.Hexgrid = Backbone.Marionette.CompositeView.extend({
         template: "#header", 
         initialize : function (options){
           this.header = options.header;
        },
        onRender : function(){
            ADD THE HEADER INFORMATION HERE WHICH WILL COME UNDER <THEAD></THEAD>
        },

      appendHtml: function(collectionView, itemView, index){
        collectionView.$("tbody").append(itemView.el);
      }
    });

I have given my comments in BOLD letter. would somebody help me to complete this Please.

4

2 回答 2

1

您不需要在视图中设置模板属性，因为函数 getTemplate 会为您完成。

无论如何，要动态生成标题，我建议您使用另一条路线，只需将标题的数据传递给您的模板，如下所示：

serializeData: function() {
    var data = Backbone.Marionette.ItemView.prototype.serializeData.apply(this, arguments);
    data.header = this.header;
    return data;
}

然后在您的模板中，您可以执行以下操作：

<% _.each(header,function(h){ %>
    <div class="span2"><%= h %></div>
<% }); %>
于 2013-07-16T10:11:48.833 回答
0

它是通过以下方式完成的：

onRender : function() {
            headerInformation = this.header;
            for ( var column in headerInformation) {
                this.$("tr").append("<th>" + headerInformation[column] + "</th>");
            }
        }

此致

于 2013-07-16T12:06:57.640 回答