Handling Events
var grid = new DataGridXL("grid", ...);
var colResizeHandler = function(gridEvent){ ... };
grid.events.on('colresize', colResizeHandler);
grid.events.off('colresize', colResizeHandler);
Actions: Any
documentchange
Document has changed. Fired after any column/row action that changes the document (insert, delete, move, resize). Use together with cellvaluechange to catch all changes to document (data). Use grid.getData() to get grid data.
Actions: Cell
_beforecellcolorchange experimental
Cell color(s) are about to be changed. Return false to prevent the event.
| name | type | desc |
|---|---|---|
| rowIds | array | IDs of affected rows |
| colIds | array | IDs of affected columns |
| changeStore | 2d array | 2d array that holds new colors |
_cellcolorchange experimental
Cell color(s) have changed.
| name | type | desc |
|---|---|---|
| rowIds | array | IDs of affected rows |
| colIds | array | IDs of affected columns |
| changeStore | 2d array | 2d array that holds new colors |
beforecellvaluechange
Cell value(s) are about to be changed. Return false to prevent the event.
| name | type | desc |
|---|---|---|
| rowIds | array | IDs of affected rows |
| colIds | array | IDs of affected columns |
| changeStore | 2d array | 2d array that holds new values |
cellvaluechange
Cell value(s) have changed. Use grid.getData() to get grid data.
| name | type | desc |
|---|---|---|
| rowIds | array | IDs of affected rows |
| colIds | array | IDs of affected columns |
| changeStore | 2d array | 2d array that holds new values |
Actions: Clipboard
beforecopy
Cell selection is about to be copied. Return false to prevent the event.
| name | type | desc |
|---|---|---|
| text | string | Copied values (Tab Seperated Values) |
| cellRange | cellRange | Cell range that was copied |
copy
Cell selection has been copied.
| name | type | desc |
|---|---|---|
| text | string | Copied values (Tab Seperated Values) |
| cellRange | cellRange | Cell range that was copied |
beforecut
Cell selection is about to be cut. Return false to prevent the event.
| name | type | desc |
|---|---|---|
| text | string | Copied values (Tab Seperated Values) |
| cellRange | cellRange | Cell range that was copied |
cut
Cell selection has been cut.
| name | type | desc |
|---|---|---|
| text | string | Copied values (Tab Seperated Values) |
| cellRange | cellRange | Cell range that was copied |
beforepaste
Clipboard data is about to be pasted. Return false to prevent the event.
| name | type | desc |
|---|---|---|
| text | string | clipboard data (Tab Seperated Values) |
paste
Clipboard data has been pasted.
| name | type | desc |
|---|---|---|
| text | string | Clipboard data (Tab Seperated Values) |
Actions: Column
beforecoldelete
Column(s) are about to be deleted. Return false to prevent the event.
| name | type | desc |
|---|---|---|
| colIds | array | IDs of deleted columns |
coldelete
Column(s) have been deleted.
| name | type | desc |
|---|---|---|
| colIds | array | IDs of deleted columns |
beforecolinsert
Column(s) are about to be inserted. Return false to prevent the event.
| name | type | desc |
|---|---|---|
| amount | int | Number of inserted columns |
| targetId | colId | ID of column to insert new columns after. A targetId of 0 means that columns should be inserted at the very start. |
colinsert
Column(s) have been inserted.
| name | type | desc |
|---|---|---|
| amount | int | Number of inserted columns |
| targetId | colId | ID of column to insert new columns after. A targetId of 0 means that columns should be inserted at the very start. |
| insertedIds | array | Array of inserted column IDs |
beforecolmove
Column(s) are about to be moved. Return false to prevent the event.
| name | type | desc |
|---|---|---|
| colIds | array | Array of moved column IDs |
| targetId | colId | ID of column to insert new column(s) after. A targetId of 0 means that column(s) should be inserted at the very start. |
colmove
Column(s) have been moved.
| name | type | desc |
|---|---|---|
| colIds | array | Array of moved column IDs |
| targetId | colId | ID of column to insert new column(s) after. A targetId of 0 means that column(s) should be inserted at the very start. |
beforecolresize
Column(s) are about to be resized. Return false to prevent the event.
| name | type | desc |
|---|---|---|
| colIds | array | IDs of resized columns |
| changeStore | array | Array that holds new widths |
colresize
Column(s) have been resized.
| name | type | desc |
|---|---|---|
| colIds | array | IDs of resized columns |
| changeStore | array | Array that holds new widths |
Actions: Row
beforerowdelete
Row(s) are about to be deleted. Return false to prevent the event.
| name | type | desc |
|---|---|---|
| rowIds | array | IDs of deleted rows |
rowdelete
Row(s) have been deleted.
| name | type | desc |
|---|---|---|
| rowIds | array | IDs of deleted rows |
beforerowinsert
Row(s) are about to be inserted.
| name | type | desc |
|---|---|---|
| amount | int | Number of inserted rows |
| targetId | rowId | ID of row to insert new rows after. A targetId of 0 means that rows should be inserted at the very start. |
rowinsert
Row(s) have been inserted.
| name | type | desc |
|---|---|---|
| amount | int | Number of inserted rows |
| targetId | rowId | ID of row to insert new rows after. A targetId of 0 means that rows should be inserted at the very start. |
| insertedIds | array | Array of inserted row IDs |
beforerowmove
Row(s) are about to be moved. Return false to prevent the event.
| name | type | desc |
|---|---|---|
| rowIds | array | Array of moved row IDs |
| targetId | rowId | ID of row to insert new row(s) after. A targetId of 0 means that row(s) should be inserted at the very start. |
rowmove
Row(s) have been moved.
| name | type | desc |
|---|---|---|
| rowIds | array | Array of moved row IDs |
| targetId | rowId | ID of row to insert new row(s) after. A targetId of 0 means that row(s) should be inserted at the very start. |
Activation
activate
Grid is activated. Triggers when a selection has been made when there wasn't any. A bit like Javascript's focus event.
deactivate
Grid is deactivated. Triggers when grid "looses focus" (by clicking outside component or outside browser window). A bit like Javascript's blur event.
Container
containerresize
Dimensions of grid container have changed.
Context Menu
contextmenuclose
Context Menu has been closed.
| name | type | desc |
|---|---|---|
| contextMenu | object | Reference to contextMenu instance |
contextmenuitemselect
Context Menu Item has been selected.
| name | type | desc |
|---|---|---|
| contextMenu | object | Reference to contextMenu instance |
| index | int | Index of selected context menu item |
| item | object | Selected context menu item |
beforecontextmenuopen
Context Menu is about to be opened. Return false to prevent the event.
| name | type | desc |
|---|---|---|
| snapPointX;Y | int | Pixel coordinates that determine where contextMenu should be displayed |
| contextMenu | object | Reference to contextMenu instance |
| items | array | Context menu items |
contextmenuopen
Context Menu has been opened.
| name | type | desc |
|---|---|---|
| snapPointX;Y | int | Pixel coordinates that determine where contextMenu should be displayed |
| contextMenu | object | Reference to contextMenu instance |
| items | array | Context menu items |
Context Menu (touch)
contextmenutouchclose
Context Menu (touch) has been closed.
| name | type | desc |
|---|---|---|
| contextMenuTouch | object | Reference to contextMenuTouch instance |
contextmenutouchitemselect
Context Menu (touch) Item has been selected.
| name | type | desc |
|---|---|---|
| contextMenuTouch | object | Reference to contextMenuTouch instance |
| index | int | Index of selected context menu (touch) item |
| item | object | Selected context menu (touch) item |
beforecontextmenutouchopen
Context Menu (touch) is about to be opened. Return false to prevent the event.
| name | type | desc |
|---|---|---|
| snapPointX;Y;Y2 | int | Pixel coordinates that determine where contextMenuTouch should be displayed |
| contextMenuTouch | object | Reference to contextMenuTouch instance |
| items | array | Context menu (touch) items |
contextmenutouchopen
Context Menu (touch) has opened.
| name | type | desc |
|---|---|---|
| snapPointX;Y;Y2 | int | Pixel coordinates that determine where contextMenuTouch should be displayed |
| contextMenuTouch | object | Reference to contextMenuTouch instance |
| items | array | Context menu (touch) items |
Lifecycle
ready
Grid is rendered and ready for interaction.
Selection
cellcursorpositionchange
Cell cursor position has changed.
| name | type | desc |
|---|---|---|
| cellCursorPosition | cellCoords | Cell cursor position in cell coordinates {x,y} |
cellselectionchange
Cell selection has changed.
| name | type | desc |
|---|---|---|
| cellSelection | cellRange | Cell selection in cell range [{x,y},{x,y}] |
Undo & Redo
beforeredo
Command is about to be redone. Return false to prevent the event.
redo
Command has been redone.
beforeundo
Command is about to be undone. Return false to prevent the event.
undo
Command has been undone.
Viewport
viewportpositionchange
Viewport position has changed.
| name | type | desc |
|---|---|---|
| viewportPosition | cellCoords | Viewport position in cell coordinates {x,y} |
