我正在使用dc.js来创建图表和数据表.
我想在表格中添加一些分页样式和搜索选项.
jQuery数据表脚本：
$(document).ready(function() {
$('#data-table').DataTable();
})
问题是 – 我得到的所有jquery数据表选项显示为搜索框,条目数.但它们都不起作用.
有人请帮忙.
发现这个post.但没什么用.
解决方法
我喜欢使用DynaTable –
http://www.dynatable.com/
1)定义你的表格html：
<table id="dc-data-table">
<thead>
<tr>
<th data-dynatable-column="client_name">Client</th>
<th data-dynatable-column="project_name">Project</th>
</tr>
</thead>
</table>
2)使用您的首选选项和交叉过滤器维度挂钩dynatable：
var dynatable = $('#dc-data-table').dynatable({
features: {
pushState: false
},dataset: {
records: tableDimension.top(Infinity),perPageDefault: 50,perPageOptions: [50,100,200,500,1000,2000,5000,10000]
}
}).data('dynatable');
3)编写一个刷新表的方法 – dc.events有助于限制刷子更改时调用的次数：
function RefreshTable() {
dc.events.trigger(function () {
dynatable.settings.dataset.originalRecords = tableDimension.top(Infinity);
dynatable.process();
});
};
4)将此方法挂钩到每个图表过滤器事件中：
for (var i = 0; i < dc.chartRegistry.list().length; i++) {
var chartI = dc.chartRegistry.list()[i];
chartI.on("filtered",RefreshTable);
}
5)调用刷新表一次以显示当前数据：
RefreshTable();
6)渲染DC图表：
dc.renderAll();
这是一个jsfiddle：http://jsfiddle.net/djmartin_umich/5jweT/2/
请注意,在这个小提琴中,我使用组而不是维度来提供可动态数据.