Utilizo el ejemplo del sitio web para probar el grupo de columnas, pero duplicará el registro de la fila. ¿El tabulador no admite el grupo de columnas con el elemento HTML? Una vez que elimine el grupo col, volverá a ser normal gracias La imagen del resultado de la prueba
Mi código:
<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 solo puede admitir la importación de tablas HTML simples, como lo indica la documentación:
Nota: el tabulador solo puede analizar tablas simples. Las tablas que usan varias filas de encabezado, atributos colspan o rowspan harán que la importación falle.
Dicho esto, puede agregar fácilmente grupos de columnas a un Tabulador, solo necesita definir la configuración de su tabla usando una matriz de objetos de definición de columna en su lugar.
Los detalles completos sobre cómo configurar una definición de columna de tablas se pueden encontrar en la Documentación de columnas
Puede encontrar un ejemplo de grupos de columnas en acción en el Ejemplo de grupos de columnas