two grids export to excel issue

[Ting]

Hi, I have two grids to export to excel in one worksheet. #gridData is main grid with report data, #grid1 is report filter data.  However, if user doesn't wants to see #grid1 in excel, it should only export #grid to excel. Can you tell me what I need to change with these codes? Thank you.

--first grid

<kendo-grid #grid [data]="gridData" (excelExport)="onExcelExport($event, grid1)">

<ng-template kendoGridToolbarTemplate>

<button type="button" kendoGridExcelCommand><span class="k-icon k-i-file-excel"></span>Export to Excel</button>
</ng-template>
<kendo-grid-excel fileName="reportname" ></kendo-grid-excel>
</kendo-grid>

--second grid

<kendo-grid [data]="dataFilters" (excelExport)="onExcelExport1($event)" #grid1  [height]="50" >
<kendo-grid-excel [fileName]="reportname" ></kendo-grid-excel>
</kendo-grid>

 

public onExcelExport(e: any, grid): void {
e.preventDefault();
this.sheetData = e;
grid.saveAsExcel();
}

onExcelExport1(e){
let dataFromFirstGrid = this.sheetData.workbook.sheets[0].rows;
e.workbook.sheets[0].rows.push({cells: []});
e.workbook.sheets[0].rows = [...e.workbook.sheets[0].rows, ...dataFromFirstGrid];
}

[Martin Bechev]

Hi Ting,

Thank you for the provided code snippet.

Let me begin with providing some general information on the Excel Export functionality and then I will provide specific examples of how the requirements can be achieved.

Basically whenever the default Grid Excel Export functionality is used the Grid data is automatically converted to an object of type Workbook. That is the default type of object when creating Excel files manually provided by Microsoft:

https://docs.microsoft.com/en-us/office/vba/api/excel.workbook

One option in order to export two Grids in the same sheet is to construct the desired Workbook manually. Please check the following article from our documentation demonstrating how to create new Workbooks manually:

https://www.telerik.com/kendo-angular-ui/components/excelexport/workbook/new-custom/

Here is an example demonstrating how to export a custom Workbook so that it represents two Grid data sets separated with an empty row:

https://stackblitz.com/edit/angular-l6jymc?file=app/app.component.ts

Another option would be to use the Grid built-in feature to construct the two separate Workbooks for the two Grids and then combine them. Please check the following example demonstrating such an approach:

https://stackblitz.com/edit/angular-equv6d?file=app/app.component.ts

The essential parts in this example are that the (excelExport) event of the first Grid is prevented. Then the generated Workbook data is saved and then (excelExport) event of the second Grid is fired by calling the second Grid saveAsExcel() method. Finally, in the (excelExport) event handler function of the second Grid, the automatically generated Workbooks for both Grids are combined.

I hope this helps.

Regards,
Martin
Progress Telerik