javascript 将列名与带有 AJAX 数据源的 DataTables 一起使用
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/32124812/
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
Using column names with DataTables with AJAX data source
提问by Jesse Green
I'm trying to upgrade my system to use 1.10 instead of 1.9 of DataTables and I'm trying to find a way to pass back the row contents using a JSON object instead of a list. Specifically instead of passing back data in the format [['data','data','data'],['data','data','data'],etc..]I want to put it in the format [['colA':'data','colB':'data','colC':'data']].
我正在尝试升级我的系统以使用 1.10 而不是 1.9 的 DataTables，并且我正在尝试找到一种使用 JSON 对象而不是列表传回行内容的方法。具体来说，不是以[['data','data','data'],['data','data','data'],etc..]我想要的格式传回数据，而是将其放入格式[['colA':'data','colB':'data','colC':'data']].
Right now I've got my AJAX function returning the data in that format and I'm trying to initialize with this code:
现在我的 AJAX 函数以该格式返回数据，我正在尝试使用以下代码进行初始化：
$("table").DataTable({
"columnDefs": [
{"name": "wo_status", "title": "wo_status", "targets": 0},
//repeat for each of my 20 or so fields
],
"serverSide": true,
"ajax": "url/to/ajax/function"
});
The results are coming back from my AJAX function correctly but DataTables is trying to find an index of 0 in row 0 and failing to find it because my table cells are indexed by their column name instead of a numerical index. Does anyone know how to tell DataTables to use the column names specified in columnDefs(or in some other option I haven't found) instead of numerical indices?
结果正确地从我的 AJAX 函数返回，但 DataTables 试图在第 0 行中找到 0 的索引但未能找到它，因为我的表格单元格是按列名而不是数字索引进行索引的。有谁知道如何告诉 DataTables 使用columnDefs（或在我没有找到的其他选项中）中指定的列名而不是数字索引？
回答by Gyrocode.com
Use columns.dataoption to specify property names as shown below:
使用columns.data选项指定属性名称，如下所示：
$("table").DataTable({
"columns": [
{ "data": "colA", "name": "colA", "title": "colA" },
{ "data": "colB", "name": "colB", "title": "colB" },
{ "data": "colC", "name": "colC", "title": "colC" }
//repeat for each of my 20 or so fields
],
"serverSide": true,
"ajax": "url/to/ajax/function"
});
回答by ahmeti
Use forEach in fnServerParams function...
在 fnServerParams 函数中使用 forEach...
$("table").DataTable({
"columns": [{
"data": "colA"
}, {
"data": "colB"
}, {
"data": "colC"
}],
"serverSide": true,
"ajax": "url/to/ajax/function",
fnServerParams: function(data) {
data['order'].forEach(function(items, index) {
data['order'][index]['column'] = data['columns'][items.column]['data'];
});
},
});
回答by madzohan
Thanks @ahmeti I've updated your approach :)
谢谢@ahmeti 我已经更新了你的方法:)
ajax: {
url: fetchUrl,
data: function ( data ) {
data['columns_map'] = {};
data['columns'].forEach(function(item, index) {
data['columns_map'][item.data] = data['columns'][index];
});
data['order'].forEach(function(item, index) {
data['order'][index]['column'] = data['columns'][item.column]['data'];
});
return {"data": JSON.stringify(data)};
}
},
