ZK Spreadsheet Essentials/Getting Started with ZK Spreadsheet/The ZK Spreadsheet Component

The ZK Spreadsheet Component

In this section, a brief overview is given on how developers work with the ZK Spreadsheet component.

The Bare Spreadsheet Component

---

ZK Spreadsheet is a single ZK component. Developers could declare it within any ZK container components, such as Window, tabs, groupbox, etc.

For example:

<window title="Bare ZK Spreadsheet" border="normal" height="500px">
<spreadsheet src="/demo_sample.xls"	
			maxrows="200" 
			maxcolumns="40"
			width="100%"
			height="450px"></spreadsheet>
</window>

which renders:

Spreadsheet Component Attributes

---

Developers customize the spreadsheet component by declaring its attributes, for example:

• the source file of the spreadsheet, for example src="/demo_sample.xls"
• the maximum number of rows of this spread sheet, for example maxrows="200"
• the maximum number of columns of this spread sheet, for example maxcolumns="40"
• size of the spreadsheet component, for example: width="500px" height="300px"

Triggered Spreadsheet Events

---

Cell Event

Name	Event Type
onCellFocused	CellEvent Description: Notifies one that the user has a focus on cell
onCellChange	CellEvent Description: Notifies one that the user has modified contents directly or indirectly on cell
onCellClick	CellMouseEvent Description: Notifies one that the user has left click on a cell
onCellRightClick	CellMouseEvent Description: Notifies one that the user has right click on a cell
onCellDoubleClick	CellMouseEvent Description: Notifies one that the user has double click on a cell

Header Event

Name	Event Type
onHeaderClick	HeaderMouseEvent Description: Notifies one that the user has left click on a header
onHeaderRightClick	HeaderMouseEvent Description: Notifies one that the user has right click on a header
onHeaderDoubleClick	HeaderMouseEvent Description: Notifies one that the user has double click on a header
onHeaderSize	HeaderEvent Description: Notifies one that the user has resize a header

Edit Event

Name	Event Type
onStartEditing	CellEvent Description: Notifies one that user has start editing cell
onStopEditing	StopEditingEvent Description: Notifies one that the user has stop editing cell

Selection Event

Name	Event Type
onCellSelection	CellSelectionEvent Description: Notifies one that user has select a range of cells
onSelectionChange	SelectionChangeEvent Description: Notifies one that the user has move or modify the range of a selection

Hyperlink Event

Name	Event Type
onHyperlink	HyperlinkEvent Description: Notifies one that user has click on the hyperlink of a cell

All source code listed in this book is at Github.