Hi,
I'm trying to export my grid to excel. I'm dynamically building the columns, but they don't get exported unless I hardcode them.
let columns = [], columnNames = []; if (!this.state.gridColumns) return; this.state.gridColumns.forEach( (column, index) => { columns.push( <ExcelExportColumn key={index} field={column.name} title={column.name}/> ); columnNames.push(column.name); } ); return ( <ExcelExport columns={columnNames} data={this.state.gridData} fileName="test.xlsx" ref={(exporter) => { this._exporter = exporter; }} > <button title="Export Excel" className="k-button k-primary" onClick={this.export} > Export to Excel </button> </ExcelExport>6 Answers, 1 is accepted
Thank you for the code snippet.
When the columns have to be passed when exporting, we can suggest passing them to the save function.
I made an example demonstrating how to export only some of the columns based on a columns array:
https://stackblitz.com/edit/react-jgpiuv?file=app/main.js
I hope this is helpful.
Regards,
Stefan
Progress Telerik
Rank 1
Thank you very much!
I also understand that I need to have have the data prior to rendering the grid.
Rank 1
Hello,
I was hoping you could shed some light on what you meant by "need to have the data prior to rendering the Grid". I am having an issue where only my columns are showing up in my Excel export but there is no data in the rows.
For context: my Grid is rendered/updated somewhat dynamically.
1. On componentDidMount, API GET request brings back my dataset
2. The Grid is empty at first
3. The user interacts with a Slider and/or DatePicker which applies a custom filter to the dataset
4. A subset of data is then rendered onto the Grid.
5. The user can dynamically change the subset of data returned by moving the slider or changing the date in the DatePicker.
Is my particular Grid implementation not going to work with ExcelExport ?
Rank 1
I`m glad to hear that the issue is resolved.
I will also provide more details on the question. The excel export does not require the Grid to have any data before rendering. If the data is not available at the moment of export, for example, if the user clicks export when the Grid is empty, the exported file will be empty as well.
Regards,
Stefan
Progress Telerik
Rank 1