New to KendoReactStart a free 30-day trial

SpreadsheetProps
Premium

NameTypeDefaultDescription

className?

string

Sets additional classes to the Spreadsheet.

jsx
<Spreadsheet className="custom-class" />

defaultProps?

SpreadsheetOptions

Represents the default props of the Spreadsheet.

jsx
<Spreadsheet defaultProps={{ toolbar: true }} />

onChange?

(event: SpreadsheetChangeEvent) => void

Triggered when a value in the Spreadsheet has been changed.

jsx
<Spreadsheet onChange={(event) => console.log(event.range)} />

onChangeFormat?

(event: SpreadsheetChangeEvent) => void

Triggered when the range format is changed from the UI.

jsx
<Spreadsheet onChangeFormat={(event) => console.log(event.range)} />

onExcelExport?

(event: SpreadsheetExcelExportEvent) => void

Fires when the user clicks the Export to Excel toolbar button.

jsx
<Spreadsheet onExcelExport={(event) => console.log(event.workbook)} />

onExcelImport?

(event: SpreadsheetExcelImportEvent) => void

Fired when the user clicks the Open toolbar button.

jsx
<Spreadsheet onExcelImport={(event) => console.log(event.file)} />

onSelect?

(event: SpreadsheetSelectEvent) => void

Triggered when the Spreadsheet selection is changed.

jsx
<Spreadsheet onSelect={(event) => console.log(event.range)} />

style?

React.CSSProperties

Specifies the styles that will be applied to the wrapping element.

jsx
<Spreadsheet style={{ height: '500px' }} />

toolbar?

boolean | SpreadsheetTab[]

true

A Boolean value which indicates if the toolbar will be displayed. It also allows customizing the tabs' content.

jsx
<Spreadsheet toolbar={false} />
<Spreadsheet toolbar={[{ text: "Custom Tab", tools: [CustomToolComponent] }]} />
Not finding the help you need?
Contact Support