Estoy trabajando con algunos datos de estudiantes y no es la primera vez que ocurre esta estructura. Tengo que presentar algunos datos sobre el desempeño de los estudiantes en la disciplina e informarme que sería interesante mostrar también un historial de los recién llegados. En resumen, dijeron que sería bueno tener una mesa que contuviera mesas. Pensé en una estructura como se muestra en las imágenes a continuación.
Recuerdo cuando era programador de .NET y tenía algo así en Syncfusion. Busqué algunos complementos de javascript, pero ninguno de ellos me sirvió bien. ¿Cualquier sugerencia? ¿Solo es posible con JavaScript y CSS?
El requisito mencionado se puede lograr mediante el uso de la funcionalidad de vinculación jerárquica en Syncfusion EJ2 Grid. Esto se explica en detalle a continuación,
El enlace jerárquico en EJ2 Grid se utiliza para visualizar las relaciones entre los registros principales y secundarios. Esta función se puede habilitar definiendo las propiedades childGrid y childGrid.queryString. childGrid describe las opciones del elemento Grid secundario y childGrid.queryString describe la relación entre las cuadrículas principal y secundaria.
Por lo tanto, tanto el Grid principal como el secundario deben contener un nombre de campo común con valores que se especifican en la propiedad "queryString" del Grid secundario. Según esta relación, la cuadrícula secundaria se asignará a su fila principal correspondiente.
Encuentre la siguiente muestra preparada en base a esto como referencia,
Muestra: https://stackblitz.com/edit/f6hauc
Se pueden consultar más detalles sobre esto en el siguiente enlace de documentación,
Documentación: https://ej2.syncfusion.com/javascript/documentation/grid/hierarchy-grid/#hierarchical-binding