fn使用colspan更新th的multi td
Nas*_*imi 5 javascript datatable jquery
我.fnUpdate()用来table根据来自数据库的数据生成.
http://legacy.datatables.net/ref
我的标题中有一些老师table,而且td正文中有一些信息table.
我可以生成数据,TDs但我想显示多个td下面的数据th.
问题
我可以设置colspanfor generated th,但是如何通过fnupdate为每个sub td分配数据.
注意:教师的数量和colspan的数量将从DB分配,我们应该动态检查colspan的数量并生成相关的td.
我想生成这样的输出
fnUpdate
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.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>
<body>
<div class="container">
<table id="example" class="display nowrap" border='1'>
<thead>
<tr>
<th colspan="2">teacher 1</th>
<th>teacher 2</th>
<th>teacher 3</th>
<th colspan="3">teacher 2</th>
<th>teacher 5</th>
<th>teacher 6</th>
</tr>
</thead>
<tbody>
<tr>
<td>Tiger Nixon</td>
<td>Tiger Nixon2</td>
<td>System Architect</td>
<td>Edinburgh</td>
<td>Edinburgh61</td>
<td>Edinburgh62</td>
<td>Edinburgh63</td>
<td>2011/04/25</td>
<td>Edinburgh3,120</td>
</tr>
</tbody>
</table>
</div>
</body>解决方案
创建时设置bAutoWidth为falsedataTable
const exampleTable = $('#example').dataTable({
"bAutoWidth": false
});
用于fnAddData()添加新行dataTable或更新整个表使用fnUpdate()。
请参阅下面的示例
const exampleTable = $('#example').dataTable({
"bAutoWidth": false
});
使用添加新行的结果fnAddData()
使用更新整个表的结果fnUpdate()
| 归档时间： |
|
| 查看次数： |
84 次 |
| 最近记录： |