Smart UI Components & Libraries – Grid, Scheduler, Gantt, Kanban for Angular, React, Next.js, Vue, Blazor, JavaScript › Forums › Data Grid › I’m having a problem exporting data (xlsx) Missing reference to ‘jszip,js’
- This topic has 1 reply, 2 voices, and was last updated 2 years, 5 months ago by
svetoslav_borislavov.
-
AuthorPosts
-
July 9, 2023 at 2:42 pm #107450
Lý Vũ
ParticipantHello everyone! I’m using the Grid component in ReactJS and I want to utilize the built-in export feature of the Grid to export data from it. However, I’m encountering the error “Missing reference to ‘jszip.js'” when calling the export function with the ‘xlsx’ format. The export works fine with the ‘csv’ format. Can you help me resolve this issue? I would greatly appreciate any guidance you can provide. Thank you all very much!
Wishing you all a productive day.
this is my code
handleXlsxBtnClick() {
this.grid.current.exportData(‘xlsx’);}
<Grid ref={this.grid}
id=”grid”
dataSource={this.props.dataSource}
sorting={this.sorting}
filtering={this.filtering}
behavior={this.behavior}
onRowInit={this.onRowInit}
expanded={this.expanded}
selection={this.selection}
columns={this.columns}
columnGroups={this.columnGroups}
onCellDoubleClick={(e) => this.handleSelectionChange(e)}
/>
<div className=”options”>
<div className=”caption” />
<div className=”option”>
<Button id=”xlsxBtn” onClick={this.handleXlsxBtnClick}>Export to Excel</Button>
</div>
</div>July 10, 2023 at 6:01 am #107451svetoslav_borislavov
ParticipantHi,
To enable every type of export, you have to copy the following files from the node_modules/smart-webcomponents-react/common:
jszip.min.js, pdfmake.min.js, vfs_fonts.js, html2canvas.min.js.
into the public folder. When they are available there, open index.html and reference them:<script type=”text/javascript” src=”https://www.htmlelements.com/demos/scripts/jszip.min.js”></script>
<script type=”text/javascript” src=”https://www.htmlelements.com/demos/scripts/pdfmake.min.js”></script>
<script type=”text/javascript” src=”https://www.htmlelements.com/demos/scripts/vfs_fonts.js”></script>
<script type=”text/javascript” src=”https://www.htmlelements.com/demos/scripts/html2canvas.min.js”></script>I hope this helps you resolve the problem!
Best Regards,
Svetoslav BorislavovSmart UI Team
https://www.htmlelements.com/ -
AuthorPosts
- You must be logged in to reply to this topic.