jQuery Datatables-未针对Ajax响应填充表 [英] jQuery Datatables - Table not populated for Ajax response
问题描述
我正在尝试将具有服务器端处理功能的jquery数据表集成到UI组件之一中.请求网址返回一个json. JSON格式正确,并在jsonlint上通过了验证.
I'm trying to integrate jquery datatables with server side processing into one of the UI components. The request url returns a json. The JSON is well formed and passes validation on jsonlint.
这是从萤火虫获取的典型json响应.
Here's a typical json response fetched from firebug.
{
"sEcho": 1,
"iTotalRecords": 6416,
"iTotalDisplayRecords": 5,
"aaData": [
{
"0": 421367,
"1": "Test1",
"2": "NEW",
"3": "Default",
"4": "18 Aug 2011 20:27:12 GMT",
"5": "TestBench",
"6": "NA"
},
{
"0": 421368,
"1": "Test2",
"2": "NEW",
"3": "Default",
"4": "18 Aug 2011 20:27:12 GMT",
"5": "TestBench",
"6": "NA"
},
{
"0": 421369,
"1": "Test3",
"2": "NEW",
"3": "Default",
"4": "18 Aug 2011 20:27:12 GMT",
"5": "TestBench",
"6": "NA"
},
{
"0": 421370,
"1": "Test4",
"2": "NEW",
"3": "Default",
"4": "18 Aug 2011 20:27:13 GMT",
"5": "TestBench",
"6": "NA"
},
{
"0": 421371,
"1": "Test5",
"2": "NEW",
"3": "Default",
"4": "18 Aug 2011 20:27:13 GMT",
"5": "TestBench",
"6": "NA"
}
]
}
脚本:
$(document).ready(function() {
var thisTable;
thisTable = $('#events').dataTable( {
"bProcessing": true,
"bServerSide": true,
"bJQueryUI": true,
"sPaginationType": "full_numbers",
"sAjaxSource": "http://localhost:9000/dt/data/all"
});
});
我在屏幕上看到处理窗口,它不会停止.该表仍然是空的.
I see processing window on the screen and it won't stop. The table is still empty.
我在这里错过了什么吗?
Am I missing anything here?
回声是问题吗?由于我一直都在查看处理窗口.
Is it a problem it sEcho? Since I am seeing processing window all through.
推荐答案
我认为您的设置需要数组数组.您是数据,是一个对象数组.因此,您必须使用"aoColumns"选项( http://www. datatables.net/release-datatables/examples/ajax/objects.html )
I think your settings expect an array of arrays. You're data is an array of objects. So you have to use the "aoColumns" option (http://www.datatables.net/release-datatables/examples/ajax/objects.html)
所以我认为应该是这样的:
So I think it should be something like this:
$(document).ready(function() {
var thisTable;
thisTable = $('#events').dataTable( {
"bProcessing": true,
"bServerSide": true,
"bJQueryUI": true,
"sPaginationType": "full_numbers",
"sAjaxSource": "http://localhost:9000/dt/data/all"
"aoColumns": [
{ "mData": "0" },
{ "mData": "1" },
{ "mData": "2" },
{ "mData": "3" },
{ "mData": "4" },
{ "mData": "5" },
{ "mData": "6" },
]
});
});
这个小提琴似乎对我有用(但是我无法测试sAjaxSource属性,因为它期望我无法访问该URL)
This fiddle seems to work for me (but I can't test the sAjaxSource property since it expects an url I can't access) http://jsfiddle.net/thomasjonas/jW7uC/1/
这篇关于jQuery Datatables-未针对Ajax响应填充表的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!