Javascript 从本地json文件填充datatable
我正在尝试使用JSON文件（Javascript 从本地json文件填充datatable,javascript,jquery,jsp,jquery-datatables,Javascript,Jquery,Jsp,Jquery Datatables,我正在尝试使用JSON文件（jsontext.JSON）填充我的数据表。我尝试了几乎所有的资源，但无法解决这个问题。我已经尝试了所有的stackoverflow资源。此问题与发布的问题不同 如果我能把JSON文件放到MyJSONObject中，那么剩下的我就可以搞定了 Json文件存储在我的c:\path\jsontext.Json中 这是json文件 [ { "Identifier": "1", "Label": "pratik", "C
jsontext.JSON[
{
"Identifier": "1",
"Label": "pratik",
"Categories": "Standard",
"UpdatedBy": "lno",
"UpdatedAt": "01-02-2013"
},
{
"Identifier": "2",
"Label": "2013",
"Categories": "Standard",
"UpdatedBy": "lno",
"UpdatedAt": "01-02-2013"
}
]
var myObject;
$.ready(function(){
myObject={};
$.getJSON('http://localhost:8080/jsontext.json', function(data){
/* here I have tried using both the paths the c:\path\jsontext.json and the one above */
myObject=data;
});
});
$(document).ready(function(){
$('#example').dataTable
( {
"sScrollY": "200px",
"bPaginate": false,
"bScrollCollapse": true,
aaData:myObject,
"aoColumns":
[
{ "mData": "Identifier" },
{ "mData": "Label" },
{ "mData": "Categories" },
{ "mData": "UpdatedBy" },
{ "mData": "UpdatedAt" },
{ "sClass": "getimage"},
{ "sClass": "editimage"},
{ "sClass": "deleteimage"}
]
});
});
<body id="dt_example">
<div id="container">
<table cellpadding="0" cellspacing="0" border="0" class="display" id="example">
<thead>
<ul>
<li> <a href="addedit.jsp">Add Code Edit</a></li>
<li> <a href="#">Import</a></li>
<li> <a href="#">Export</a></li>
</ul>
<tr>
<th>Identifier</th>
<th>Label</th>
<th>Categories</th>
<th>UpdatedBy</th>
<th>UpdatedAt</th>
<th></th>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td>Row 1 Data 1</td>
<td>Row 1 Data 2</td>
<td>Row 1 Data 3</td>
<td>Row 1 Data 4</td>
<td>Row 1 Data 5</td>
<td class="getimage"><a href="addedit.jsp"></a></td>
<td class="editimage"></td>
<td class="deleteimage"></td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
标识符
标签
类别
更新人
更新的
第1行数据1
第1行数据2
第1行数据3
第1行数据4
第1行数据5
谁能告诉我哪里出了问题 看起来问题可能是ajax正在加载和设置myObject变量，但这是在Datatables初始化后完成的，因此在请求完成后，它不会获取更新的myObject变量。您可以这样做来修复该问题：
var myObject;
$.ready(function(){
myObject={};
$.getJSON('http://localhost:8080/jsontext.json', function(data){
/* here I have tried using both the paths the c:\path\jsontext.json and the one above */
myObject=data;
$('#example').dataTable().fnAddData(myObject);
});
});
实际上，如果您在开发人员工具中看到服务器响应，您可以找到接收到的数据。就我使用dataTables而言，json文件必须包含整个数据的“键”，否则它将没有任何引用 尝试按如下方式修改json：
{
"mydata":[
{
"Identifier": "1",
"Label": "pratik",
"Categories": "Standard",
"UpdatedBy": "lno",
"UpdatedAt": "01-02-2013"
},
{
"Identifier": "2",
"Label": "2013",
"Categories": "Standard",
"UpdatedBy": "lno",
"UpdatedAt": "01-02-2013"
}
]
}
如果你想使用json对象而不是“aaData”，你可以使用datatable来指定相应的对象。谢谢你的回复，每一个我都得到了我尝试过的答案，谢谢
var someData=JSON.parse(document.getElementById("populate-holdingBin").innerHTML);
oTables=$('#someReport').dataTable
({
"bJQueryUI":true,
"bScrollCollapse":true,
aaData:someData,
"aoColumns":
[ ...etc etc.............................. ]
});
根据jquery文档，它应该是一个json对象。getJSON将自动执行从字符串到json对象的转换。不，我无法获取要填充的数据表。请确保您的web服务器可以访问您的json文件。Javascript在访问客户端机器上的本地文件时存在安全问题。根据文档，它说“数据”是一个json对象，但我甚至无法将其打印出来。让我们来看看