Posted 31 October 2024, 9:53 am EST
I have created a small app to replicate the issue using the my code (slightly modified). Normally, the grids in my app contact an OData endpoint but in this example they simply load an array of data. The sample application is attached here:
wijmo-grid-example.zip
To run it, execute npm run dev in the folder which will run the vite app.
In App.tsx, I set up the configuration for the grid by defining a list of columns, etc. My sample data are objects that match this interface:
interface IItem {
id: number,
title: string,
assignedTo: string,
openIssues: number,
closedIssues: number,
totalIssues: number,
hasOpenIssues: boolean,
}
When you check the App.tsx grid column configuration, you will see that I have defined some cell templates:
- The title column renders the title and adds an asterisk at the end if hasOpenIssues is true.
- The assignedTo column adds “(User)” to the end of the assignedTo value.
- The issues column is not bound to any of the fields and instead renders a span that contains “openIssues / closedIssues (totalIssues)”. This span is pink if there are any open issues.
- The hasOpenIssues column is of type boolean. Inside WijmoGrid.tsx, the component automatically adds a cell template which changes the displayed value to either Yes or No depending on the boolean value.
Above the grid you will find a button labeled “Export Grid”. Clicking this dispatches a redux action which triggers the WijmoGridExporter component. This component then executes the “export to Excel” functionality of the grid. When it does so, an error is thrown for every item when it tries to instantiate the cell template (WijmoGridExporter.ts line 134). The code will log to the output console each of these errors.
The file is exported successfully regardless of the errors. However, all of the cell templates were ignored. The title does not have the extra asterisk, the assignedTo is missing the “(User)”, and the issues column is completely blank. However, the hasOpenIssues column correctly used its template to output “Yes” and “No”.
What must I do to my sample app to have the export to Excel functionality respect my cell templates, correctly instantiate them, and include them in the output?
