Wijmo Support Needed – Export Tab1 + Tab2 FlexGrids into One Excel File

Wijmo Support Needed – Export Tab1 + Tab2 FlexGrids into One Excel File

Posted by: nilesh_nichal on 6 May 2026, 6:17 am EST

• 

  nilesh_nichal

  • Post Options:
  • Link
    Copy

  Posted 6 May 2026, 6:17 am EST

  We have two Wijmo FlexGrids placed in two UI tabs (Tab 1 and Tab 2), and we want to export both grids into a single Excel file such that:
  
  Tab 1 grid data goes into Worksheet 1 (e.g., “Tab 1” / “Permissions – 1”)
  
  Tab 2 grid data goes into Worksheet 2 (e.g., “Tab 2” / “Permissions – 2”)
  
  We are currently using FlexGridXlsxConverter.saveAsync() for exporting one grid:
  
  wjcGridXlsx.FlexGridXlsxConverter.saveAsync(
  
  this.groupAccessGrid,
  
  {
  
  includeColumnHeaders: true,
  
  includeCellStyles: true,
  
  formatItem: this.exportFormatItem
  
  },
  
  “permissions”
  
  );
  
  Could you please guide us on the best supported approach to achieve the following:
  
  Export two FlexGrids into one Excel workbook with two worksheets.
  
  Is there a supported API like FlexGridXlsxConverter.saveAsync() that supports multiple grids / multiple sheets?
  
  Or should we generate Workbook objects for each grid and then merge worksheets into a single workbook?
  
  We also use formatItem to customize export values/styles.
  
  How can we apply the same formatItem logic for both sheets (Grid in Tab 1 and Grid in Tab 2)?
  
  If merging workbooks is the recommended solution, can you share a reference/sample showing:
  
  how to export Grid 1 → Worksheet 1
  
  export Grid 2 → Worksheet 2
  
  save final workbook as a single .xlsx file

• 

  vivek.pannu

  

  • Post Options:
  • Link
    Copy

  Posted 6 May 2026, 8:35 am EST

  Hi Nilesh,
  
  There is no direct method available in the API to export multiple grids into a single workbook; however, you can generate separate workbooks for each grid and then combine them into one, as you mentioned. Please refer to the following sample demonstrating the same - https://stackblitz.com/edit/angular-dio7qmsz?file=app%2Fapp.component.ts
  
  In case, you face any issues, please let us know.
  
  Regards

• 

  nilesh_nichal

  • Post Options:
  • Link
    Copy

  Posted 7 May 2026, 2:17 am EST

  Thank you for the response and for sharing the StackBlitz sample.
  
  We tried the suggested approach of generating separate workbooks and merging the worksheets. However, in our case, the sample does not work as expected because our FlexGrids are rendered inside UI tabs controlled using *ngIf.
  
  Since the inactive tab grid is not part of the DOM due to ngIf, the grid instance is not available at the time of export, and the worksheet for that grid is not generated correctly.
  
  Could you please suggest a supported solution that works when grids are conditionally rendered using *ngIf? Specifically, we are looking for:
  
  A recommended way to export FlexGrids that are inside ngIf-based tabs
  
  Guidance on whether grids need to be initialized/rendered before export and how best to handle this
  
  An updated sample or StackBlitz demonstrating multi-sheet export that supports ngIf-based tab layouts
  
  This would help us align with Wijmo best practices while keeping our existing tab implementation intact.
  
  Looking forward to your guidance.

• 

  vivek.pannu

  

  • Post Options:
  • Link
    Copy

  Posted 7 May 2026, 6:55 am EST

  Hi Nilesh,
  
  Sorry, but it would not be possible to generate the flexgrid workbook without the grid instance. We will need an instance of the target flexgrid to export it to an Excel file, as it will be used to evaluate the grid data and layout internally while generating the Excel workbook. So, we recommend using the ‘[hidden]’ property to hide the flexgrids on the page instead of using ‘ngIf’ if possible. Another alternative solution would be to use Wijmo’s Tab Panel control for creating the tab layout, if it fits your requirements well.
  
  You can refer to the following updated sample for the same - https://stackblitz.com/edit/angular-nsd2vrgr?file=app%2Fapp.component.html
  
  Regards