javascript 带有 Node.js 的 jQuery 数据表
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/30836514/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery DataTables with Node.js
提问by Raj
So i am trying to implement a pagination table with the datatables plugin, this is my first time using this plugin. I followed the documentation on the plugin and tried to get the values from the server through the use of Ajax, as per presented in the plugins documentation.
所以我想用datatables插件实现一个分页表,这是我第一次使用这个插件。我遵循了插件的文档,并尝试通过使用 Ajax 从服务器获取值,如插件文档中所述。
I seem to be getting the following error once i make the get request and i am unsure of why?
一旦我发出 get 请求,我似乎收到以下错误,但我不确定为什么?
Error: Uncaught TypeError: Cannot read property 'length' of undefined
错误:未捕获的类型错误:无法读取未定义的属性“长度”
On client side i have the following code
在客户端,我有以下代码
viewReports = {
init: function(){
$('#paginatedData').DataTable({
"processing": true,
"serverSide": true,
"ajax": '/viewreports'
});
}
};
$(document).ready(viewReports.init);
In my server side i have the following
在我的服务器端,我有以下内容
router.get('/viewreports', function(res, req){
async.parallel({
viewReports: function(callback){
restCall('/rest/bugbounty/latest/message/searchReport', 'POST', parameters, function(data){
callback(null, data);
});
}
}, function(err, result){
if(!err){
res.send(result.viewReports);
res.render('viewreports');
}
});
});
Returned JSON:
返回的 JSON:
{ reportList: [ { reportID: 'EIBBP-448', eBayUserID: ' ', reportStatus: 'New', summary: 'BugBounty Report created by Raj', lastUpdatedDate: '2015-06-15 01:05', createdDate: '2015-06-15 01:05', paypalLoginID: '[email protected]' } ], searchStatus: 'Success', eBayUserID: '', errorCode: '0', rowCount: '6', pageNumber: '1', paginationValue: '1', paypalLoginID: '[email protected]' }
{ reportList: [ { reportID: 'EIBBP-448', eBayUserID: ' ', reportStatus: 'New', summary: 'BugBounty Report created by Raj', lastUpdatedDate: '2015-06-15 01:05', createdDate: ' 2015-06-15 01:05', paypalLoginID: '[email protected]' } ], searchStatus: 'Success', eBayUserID: '', errorCode: '0', rowCount: '6', pageNumber: '1' , paginationValue: '1', paypalLoginID: '[email protected]' }
It would be great to know if there is anyone who has worked with node.js server side processing for datatables
很高兴知道是否有人曾使用 node.js 服务器端处理数据表
回答by davidkonrad
You need to define dataSrc
and columns.data
- the following should work :
您需要定义dataSrc
和columns.data
- 以下应该工作:
var table = $('#example').DataTable({
processing: true,
serverSide: true,
ajax: {
url: "/viewreports",
dataSrc: "reportList"
},
columns: [
{ data : "reportID" },
{ data : "eBayUserID" },
{ data : "reportStatus" },
{ data : "summary" },
{ data : "lastUpdatedDate" },
{ data : "createdDate" },
{ data : "paypalLoginID" }
]
});
on an empty table :
在一张空桌子上:
<table id="example"></table>
dataSrc
to specify what the array holding row items is named (cause of "Cannot read property 'length' of undefined")columns.data
to map item properties to columns
dataSrc
指定保存行项目的数组的名称(原因是“无法读取未定义的属性‘长度’”)columns.data
将项目属性映射到列
回答by Danny Sofftie
You simply don't have to bother with the server side processing.
I used a simple way to trick dataTables
initialization.
您根本不必理会服务器端处理。我使用了一种简单的方法来欺骗dataTables
初始化。
First, you will need to fetch the data you want to display in the table through your most preferred way, after you have confirm that data displays well, now head to where you initialize dataTables
and make it so that it delays before initialization.
首先,您需要通过您最喜欢的方式获取要在表中显示的数据,在确认数据显示良好后,现在前往初始化的位置dataTables
并使其在初始化之前延迟。
setTimeout(() => {
$('#yourtable').dataTable({
// datatables customization options
});
}, 100)
For example, in my case I gave it a delay of 100ms, and it works like a charm.
例如,在我的例子中,我给了它 100 毫秒的延迟,它就像一个魅力。