使用Datatables動態創建列jquery

我正在使用Datatables與server_processing來獲取數據，主要問題是我不想指定html中的列的名稱(<th width="25" id ="th1">id</th>)，我想在通過ajax獲取數據時動態創建列。使用Datatables動態創建列jquery

我的代碼是：

$('#table').dataTable({ 

    "bProcessing": true, 
    "bServerSide": true, 
    "sAjaxSource": "server_processing.php?db="+pid+"&table="+id+"", //pid is the name of database and id the name of the table 
    "bJQueryUI": true, 
    "sPaginationType": "full_numbers" 

});

來源

2011-10-09 aminedev

「雖然數據表可以從DOM中直接獲取有關表的信息，你不妨給數據表的每一列的具體說明這是可以做到用任aoColumnDefs參數或aColumns以及爲每列提供的對象信息。「 - http://datatables.net/usage/columns

喜歡的東西：

HTML

<table class="display" id="table"></table>

$("#table").dataTable({ 
    bJQueryUI:true, 
    aoColumns:[ 
     {mDataProp:"foo",sTitle:"Foo Title"}, 
     {mDataProp:"bar",sTitle:"Bar Title"} 
    ], 
    fnServerData: function(sUrl, data, fnCallback){ 
     $.get('data.php', function(res) { 
      fnCallback({ // process results to match table format 
       "sEcho":config.sEcho, 
       "iTotalRecords":res.data.total || res.data.count, 
       "iTotalDisplayRecords":res.data.count || res.data.total, 
       "aaData":res.data.list 
      }) 
     }); 
    } 
})

哪裏data.php是

{ 
    data:{ 
     total:200, 
     count:3, 
     list:[ 
      {foo:"Foo 1",bar:"Bar 1"}, 
      {foo:"Foo 2",bar:"Bar 2"}, 
      {foo:"Foo 3",bar:"Bar 3"}, 
     ] 
    } 
}

這裏還有一個很好的總結： http://datatables.net/usage/options#aaData

來源

2011-12-09 18:42:45 Shanimal

這是一個很好的答案，但它不回答實際的OP。他在詢問列名和列說明，並且您正在回答數據。 –

Hey Giovanni，感謝您的評論，但出於好奇，您是否錯過了這篇文章的第一部分？ aColumns描述列名稱。爲了清晰起見，我添加了JSON數據。 – Shanimal

使用Datatables動態創建列jquery

回答

相關問題