創建模板骨幹鑑於

使用JSON數據填充它，我有模板，在HTML作爲創建模板骨幹鑑於

<script type="text/template" id="table-template"> 
    <div id="table-body"></div>       
</script>

我的骨幹鑑於這個樣子的

var app = app || {}; 
$(function ($) { 
    'use strict'; 
    info = [ 
     { 
      "id": 1, 
      "Age": 70, 
      "salary": 700000, 
      "name": "Mike", 
     }, 
     { 
      "id": 2, 
      "Age": 18, 
      "salary": 30000, 
      "name": "Mike", 
     }, 
    ]; 
    app.infoView = Backbone.View.extend({ 
     initialize: function() { 
      console.log('initialize'); 
     }, 
     drawinfoTable: function() { 
      console.log('create datatable'); 
      $('#test').dataTable({ 
       "aaData": groupdata, 
       "aoColumns": [ 
        { "mDataProp": "id" }, 
        { "mDataProp": "age" }, 
        { "mDataProp": "sal" }, 
        { "mDataProp": "active" }, 
        { "mDataProp": "name" } 
       ] 
      }); 
     } 
     render: function() { 
      console.log('render'); 
      var template = _.template($("#-template").html(), {}); 
      this.$el.html(template); 
     } 
    }); 
});

其實與上面的json數據，我想創建列名稱id，薩爾，活動&薩爾數據表。我正在使用jquery.dataTables.min.js來創建數據表。然後，我想將該數據表插入「table-body」div中，該表存在於「table-template」中。對你的幫助表示感謝。

來源

2013-03-15 Lasang

不理解你的問題。你能否用正確的語法來重述你的問題？你是否試圖使用'info'變量中的信息渲染模板中的表格？ – HungryCoder 2013-03-15 08:17:37

@HungryCoder，我希望你現在明白我的問題。 – Lasang 2013-03-15 08:24:29

是的，我希望如此。寫一個答案 – HungryCoder 2013-03-15 08:27:14

您的模板應該是這個樣子：

<script type="text/template" id="table-template"> 
    <div id="table-body"> 
     <table> 
      <tr> 
       <th>id</th> 
       <th>age</th> 
       <th>salary</th> 
       <th>name</th> 
      </tr> 
      <% _.each(info, function(data, index) { %> 
      <tr> 
        <td><%= data.id %></td> 
        <td><%= data.Age %></td> 
        <td><%= data.salary %></td> 
        <td><%= data.name %></td> 
      </tr> 
      <% }); %> 
     </table> 
    </div>       
</script>

而且渲染方法：

render: function() { 
    console.log('render'); 
    var template = _.template($("#-template").html(), { info : info }); 
    this.$el.html(template); 
}

來源

2013-03-15 08:25:46

之間 - 索引）{％> - ，我得到錯誤，多重信息錯誤 – Lasang 2013-03-15 11:39:47

固定，有一個）;失蹤，抱歉。 – 2013-03-15 11:41:48

@Sylvanus已經回答瞭如何渲染視圖。您所需要的只是激活數據表。

嘗試他的渲染功能

render: function() { 
    console.log('render'); 
    var template = _.template($("#-template").html(), { info : info }); 
    this.$el.html(template); 
    //initialize datatable 
    this.$el.find('#table-body').find('table').dataTable(); 
}

的以下修改你只需要你的模板渲染完成後，初始化數據表。

來源

2013-03-15 08:36:59 HungryCoder

創建模板骨幹鑑於

回答

相關問題