使用dynatable.js的动态列名
我使用dynatable.js在表format.When i中打印json数据，硬编码json数据为jdbc_driver_id和database_id，json数据被打印为correctly.But，每次收到的json数据与不同的名称不同，我希望标签内有不同的名称，根据从json.Please收到的数据告诉我一个查询的解决方案。
/***************************JS FILE********************************/
$(function(){
//HERE I AM GETTING MY JSON RESPONSE AS KEY AND VALUE.I WANT THE NAME INSIDE <TH> DYNAMICALLY SINCE MY JSON DATA RECEIVED IS DIFFERENT EACH TIME.//
json response is
[{"database_id":"1","jdbc_driver_id":"2"},
{"database_id":"2","jdbc_driver_id":"1"},
{"database_id":"3","jdbc_driver_id":"4"},
{"database_id":"4","jdbc_driver_id":"1"}]
//SO IN THE response I AM GETTING THE ABOVE JSON DATA//
var response = jQuery.parseJSON(response);
var dynatable =$('#my-final-table').dynatable({
table: {
defaultColumnIdStyle: 'underscore'
},
dataset: {
records: response//HERE IS THE JSON RESPONSE//
}
});
});/ PAGE********************************/ /*JSP
//I WANT DYNAMIC NAMES INSIDE THE TH TAG//
<table id="my-final-table">
<thead>
<th>jdbc_driver_id</th>
<th>database_id</th>
</thead>
<tbody>
</tbody>
</table> 回答 2
Stack Overflow用户
发布于 2014-08-24 20:56:29
DynaTable现在不支持这一点。这里是它的一个特性请求。作为解决办法，在初始化DynaTable之前，我通过修改DOM来添加属性名。
Stack Overflow用户
发布于 2014-09-29 07:54:44
我想实现同样的目标，因为我很懒，我发现一个解决办法不是最好的，而是在工作。
我使用这个插件(JsonToTable)从具有正确头名的JSON字符串生成一个dynatable，然后在生成的表上使用dynatable添加搜索、分页和排序功能。
下面是一个JS代码示例：
$(document).ready(function() {
var str = 'YOUR_JSON_STRING';
var json = eval(str);
var jsonHtmlTable = ConvertJsonToTable(json, 'jsonTable', null, 'Download');
$("#container").append(jsonHtmlTable);
$('#jsonTable').dynatable({
dataset: {
records: json
}
});
});以及标记：
<html>
<head>
<link rel="stylesheet" media="screen" href="stylesheets/jquery.dynatable.css">
<script type="text/javascript" src="javascripts/jquery-2.1.0.min.js"></script>
<script type="text/javascript" src="javascripts/json-to-table.js"></script>
<script type="text/javascript" src="javascripts/jquery.dynatable.js"></script>
</head>
<body>
<div id="container">
</div>
</body>
</html>生成的表有点难看，所以您可能需要添加一些CSS，但我将由您决定。
https://stackoverflow.com/questions/25288081
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号