填充jquery datatable ajax txt文件

Question

我是一名jquery/ajax新手，正在浏览数据表示例。我在用eclipse中的txt数据填充数据表时遇到了问题。我刚收到一条装货信息。如能提供任何协助，将不胜感激。

<table>
  <thead>
    <tr>
      <th>Name</th>
      <th>Position</th>
      <th>Office</th>
      <th>Extn</th>
      <th>Start date</th>
      <th>Salary</th>
     </tr>
  </thead>
</table>

<script>    
$(document).ready(function() {
  $('#example').dataTable( {
    "ajax": "data/object.txt",
    "columns": [
      { "data": "name" },
      { "data": "position" },
      { "data": "office" },
      { "data": "extn" },
      { "data": "start_date" },
      { "data": "salary" }
    ]
  } );
} );
</script>

/////object.txt 
{
  "data": [
    {
      "name": "Tiger Nixon",
      "position": "System Architect",
      "salary": "$320,800",
      "start_date": "2011/04/25",
      "office": "Edinburgh",
      "extn": "5421"
    },...................

Answer 1

在你的代码样本中，你有一行，

"columns": [{ "data": "name" },{ "data": "position" },{ "data": "office" },{ "data": "extn" },{ "data": "start_date" },{ "data": "salary" }]

只需将列更改为"columnDefs“，即引用datatable插件中的列默认值选项。

而且，您正在调用一个名为“示例”的id上的数据表插件，您还没有定义这个插件。所以给你的桌子一个id="example"

所以最后的代码应该是

​

$(document).ready(function() {
  $('#example').dataTable({
    "ajax": 'array.txt',
    "columnDefs": [{   /* changed this */
      "data": "name"
    }, {
      "data": "position"
    }, {
      "data": "office"
    }, {
      "data": "extn"
    }, {
      "data": "start_date"
    }, {
      "data": "salary"
    }]
  });
});

<link href="//cdn.datatables.net/1.10.5/css/jquery.dataTables.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="//cdn.datatables.net/1.10.5/js/jquery.dataTables.min.js"></script>
<table id="example" class="display" cellspacing="0" width="100%">
  <thead>
    <tr>
      <th>Name</th>
      <th>Position</th>
      <th>Office</th>
      <th>Extn</th>
      <th>Start date</th>
      <th>Salary</th>
    </tr>
  </thead>
</table>

​

现在，上面的代码片段将无法运行，因为到array.txt的路径是错误的。本地复制array.txt文件。篡改或代码片段不允许ajax请求通过它们。

下面是示例array.txt (从数据表网站@ https://www.datatables.net/examples/ajax/data/arrays.txt复制)

希望这能有所帮助。快乐编码:)

屏幕在我的本地机器上拍摄

​

​