使用分组列标题时,表格中的记录重复



我使用网站上的示例来测试列组,但它会复制行记录tabulator不支持带有HTML元素的col组吗?一旦我删除col组,它将变为正常非常感谢。测试结果图像

我的代码:

<table id="example-table">
<thead>
<tr>
<th >Name</th>
<th >Age</th>
<th>Gender</th>
<th>Height</th>
<th>Driver</th>
<th>favouritecolor</th>
<th>dob</th>
</tr>
</thead>
<tbody>
<tr>
<td>Billy Bob</td>
<td>12</td>
<td>male</td>
<td>1</td>
<td>yesdrive</td>
<td>red</td>
<td>22/04/1994</td>
</tr>
<tr>
<td>Mary May</td>
<td>1</td>
<td>female</td>
<td>2</td>
<td>yesdrive</td>
<td>blue</td>
<td>14/05/1982</td>
</tr>
</tbody>
</table>
<script>
var table = new Tabulator("#example-table", {
columnHeaderVertAlign:"bottom", //align header contents to bottom of cell
columns:[
{title:"Name", field:"name", width:160},
{//create column group
title:"Work Info",
columns:[
{title:"Age", field:"age"},
{title:"Height", field:"height"},
{title:"Driver", field:"driver"},
],
},
{//create column group
title:"Personal Info",
columns:[
{title:"Gender", field:"gender"},
{title:"favouritecolor", field:"favouritecolor"},
{title:"dob", field:"dob"},
],
},
],
});
</script>

Tabulator只能支持导入简单的HTML表,正如文档所述:

注意:Tabulator只能解析简单的表。使用多个的表标题行、列span或行span属性将导致导入失败

也就是说,您可以轻松地将列组添加到表格中,只需要使用列定义对象数组来定义表设置。

有关如何设置表格列定义的全部详细信息,请参阅列文档

在列组示例中可以找到列组的作用示例

最新更新