Saving Files on the Server

The Excel Export component enables you to send the generated Excel file to a remote service.

To save a file on the server:

1. Use the toDataURL method to get the base64-encoded contents.
2. Post the contents to the server.

jsx

import * as React from 'react'
import * as ReactDOM from 'react-dom';

import { products } from './products';

data = products

class App extends React.Component {
    _exporter;
    fileName = "Products.xlsx"

    export = () => {
        this.save(this._export)
    }
    save = (component) => {
        component.toDataUrl().then((dataURL) => {
            const base64 = dataURL.split(";base64,")[1];

            fetch(SAVE_URL, {
                method: 'POST',
                body: {
                    base64: base64,
                    fileName: this.fileName
                }
            });
        });
    }
    render() {
        return(
            <div>
                <button className="k-button" onClick={this.export}>Export to Excel</button>

                <ExcelExport
                    data={data}
                    ref={(exporter) => { this._exporter = exporter; }}
                >
                    <ExcelExportColumn field="ProductID" title="Product ID" />
                    <ExcelExportColumn field="ProductName" title="Product Name" />
                </ExcelExport>
            </div>
        )
    }
}

Suggested Links

• API Reference of the Excel Export Component