我对这个领域的了解几乎没有任何意义,所以我提前为做饭做饭而道歉。
我已经将DataTables用于其他方面,因为它提供了如此惊人的功能,我想尝试制作一些不太依赖或假设要显示的数据/列的东西。
以下是我所使用的示例,并且在我获取DataTables的地方并不起作用 - Uncaught TypeError
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<link href="https://nightly.datatables.net/css/jquery.dataTables.css" rel="stylesheet" type="text/css" />
<script src="https://nightly.datatables.net/js/jquery.dataTables.js"></script>
<meta charset=utf-8 />
<title>DataTables - JS Bin</title>
</head>
<body>
<div class="container">
<table id='tblAms' class='display responsive col-md-12 table-hover table-striped order-column'> <!-- width="100%" cellspacing="0"> -->
</table>
</div>
<script>
$(document).ready( function () {
var outCols ={};
var resultSet = JSON.parse('{"REC":{"COL_CNT":2,"COLUMNS":[{"title":"NAME"},{"title":"COUNTRY"}],"CNT":5,"DATA":[{"QUAL":[{"COL_VAL":"Ronaldo"},{"COL_VAL":"Spain"}]},{"QUAL":[{"COL_VAL":"Messi"},{"COL_VAL":"Spain"}]},{"QUAL":[{"COL_VAL":"Sanchez"},{"COL_VAL":"England"}]},{"QUAL":[{"COL_VAL":"Alli"},{"COL_VAL":"England"}]},{"QUAL":[{"COL_VAL":"Dybala"},{"COL_VAL":"Italy"}]}]}}');
$.each(resultSet, function(k, v){
outCols.COLUMNS = v.COLUMNS;
var tst = [];
var tst2 = [];
$.each(v.DATA, function(index, value){
tst = $.map(value.QUAL, function(val, ind){
return val.COL_VAL;
});
tst2.push(tst);
});
outCols.DATA = tst2;
});
var table = $('#tblAms').DataTable({
colReorder: true,
destroy: true,
"bFilter":true,
data: outCols[0].DATA,
columns: outCols[0].COLUMNS
});
} );
</script>
</body>
</html>
我在SO上看到了一个例子,其中提出了这种方法,但我太绿了,无法让它发挥作用。同样,重要的是显示所需的列数可能会发生变化。我也不能对JSON做很多事情,所以必须遵循示例格式(标题/列的数量需要灵活)。
感谢您的帮助。