Hi James,
Thanks for contacting Syncfusion support.
We have validated your query and created a sample based on your requirement. In the below sample we have customized(hide) the child grid header from Grid. You can also use the below CSS selector to remove the header from child Grid.
Kindly refer to the below code example and sample for more information.
[index.ts]
|
let grid: Grid = new Grid({
dataSource: employeeData,
columns: [
{ field: 'EmployeeID', headerText: 'Employee ID', textAlign: 'Right', width: 120 },
],
childGrid: {
dataSource: data,
queryString: 'EmployeeID',
columns: [
{ field: 'OrderID', headerText: 'Order ID', textAlign: 'Right', width: 120 },
],
},
height: 315
});
grid.appendTo('#Grid');
|
[index.html]
|
<style>
.e-grid .e-detailrow .e-grid .e-gridheader {
display : none
}
.e-grid .e-detailrow .e-grid .e-content {
border-top : 1px solid #e0e0e0;
}
</style> |
Regards,
R.Dhivya
