DATATABLEヘッダ解決しよう

Question

、BELOW

を参照して私はこのようなヘッダ名を含むように私のHTMLファイルを変更したJavaScriptファイル内の列の宣言を除去します。誰もが望むなら、javascriptファイルを投稿します。

<table id="example" class="display" cellspacing="0"> 
     <thead> 
      <tr> 
       <th>User ID</th> 
       <th>Name</th> 
       <th>Active</th> 
       <th>Email</th> 
       <th>Type</th> 
       <th>Address</th> 
       <th>City</th> 
       <th>State</th> 
       <th>Zip Code</th> 
       <th>Phone</th> 
       <th>Shirt Size</th> 
       <th>Company Name</th> 
       <th>Member Since</th> 
      </tr> 
     </thead> 
    </table> 

私は自分のサイトでDataTableを動作させようとしています。私のデータが正しく表示されていますが、何らかの理由で私のヘッダーのタイトルが表示されません。データ配列が正しい。私はこのリンクで提案されたことを試しましたが、うまくいきませんでした。

Jquery datatables not showing column headings

だけでなく、私は、ヘッダーを表示するために取得するにはどうすればよいhttps://datatables.net/examples/data_sources/js_array.html

のドキュメント？おそらくあまりにも多すぎるからですか？

$(document).ready(function() { 
    var userData = []; 
    $.ajax({ 
     type: "GET", 
     url: "/api/User", 
     contentType: "application/json", 
    }).done(function (d) { 
     var userArray = []; 
     //console.log(d); 
     for (i = 0; i < d.length; i++) { 
      userData[i] = []; 
      userData[i].push(d[i].id, d[i].isActive, d[i].name, d[i].email, d[i].type, d[i].address, 
      d[i].city, d[i].state, d[i].zip, d[i].phone, d[i].tshirtSize, d[i].companyName, d[i].dateCreated); 
     } 
     console.log(userData); 

     $('#example').DataTable({ 
      "aaData": userData, 
      "aoColumns": [ 
       { title: "User ID" }, 
       { title: "Active" }, 
       { title: "Email" }, 
       { title: "Type" }, 
       { title: "Address" }, 
       { title: "City" }, 
       { title: "State" }, 
       { title: "Zip Code" }, 
       { title: "Phone" }, 
       { title: "Shirt Size" }, 
       { title: "Company Name" }, 
       { title: "Member Since" } 
      ] 
     }); 
    }); 
}); 

自分のHTMLクラス。残りは、このセクションでは、身体

<script src="js/admin-home.js"></script> 
<script type="text/javascript" charset="utf8" src="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/jquery.dataTables.min.js"></script> 
<link rel="stylesheet" type="text/css" href="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/css/jquery.dataTables.css"> 
<script type="text/javascript" charset="utf8" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.2.min.js"></script> 

<table id="example" class= "display" cellspacing="0"> 
</table> 

Answer 1

使用中 列プロパティ

$('#example').dataTable({ 
    "columns": [ 
    { "title": "My column title" }, 
    .. 
... 
.... 
    ] 
});