Handling Events
var grid = new DataGridXL("grid", ...);
var resizeColsHandler = function(gridEvent){ ... };
grid.events.on('resizecols', resizeColsHandler);
grid.events.off('resizecols', resizeColsHandler);
Actions: Any
⚪ change
Table content has changed in whatever way. Catch-all event for any event that might change the data set: setcellvalues, deletecols/-rows, insertcols/-rows, movecols/-rows. Use grid.getData() to get grid data.
Actions: Cell
⚪ beforesetcellvalues
Cell value(s) are about to be changed. Return false to prevent the event.
name | type | desc |
---|---|---|
colIds | array | IDs of affected columns |
rowIds | array | IDs of affected rows |
selection | selection | array of selection objects |
values | 2d array | 2d array that holds new values |
⚪ setcellvalues
Cell value(s) have changed. Use grid.getData() to get grid data.
name | type | desc |
---|---|---|
colIds | array | IDs of affected columns |
rowIds | array | IDs of affected rows |
selection | selection | array of selection objects |
values | 2d array | 2d array that holds new values |
Actions: Column
⚪ beforedeletecols
Column(s) are about to be deleted. Return false to prevent the event.
name | type | desc |
---|---|---|
colIds | array | IDs of deleted columns |
⚪ deletecols
Column(s) have been deleted.
name | type | desc |
---|---|---|
colIds | array | IDs of deleted columns |
⚪ beforefreezecols
Column(s) are about to be frozen.
name | type | desc |
---|---|---|
rowId | colId | Column ID |
⚪ freezecols
Column(s) have been frozen.
name | type | desc |
---|---|---|
rowId | colId | Column ID |
⚪ beforehidecols
Column(s) are about to be hidden.
name | type | desc |
---|---|---|
colIds | array | Array of column IDs |
⚪ hidecols
Column(s) have been hidden. Return false to prevent the event.
name | type | desc |
---|---|---|
colIds | array | Array of column IDs |
⚪ beforeinsertcols
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. |
⚪ insertcols
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 |
⚪ beforemovecols
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 move new column(s) after. A targetId of 0 means that column(s) should be moved to the very start. |
⚪ movecols
Column(s) have been moved.
name | type | desc |
---|---|---|
colIds | array | Array of moved column IDs |
targetId | colId | ID of column to move new column(s) after. A targetId of 0 means that column(s) should be moved to the very start. |
⚪ beforeresizecols
Column(s) are about to be resized. Return false to prevent the event.
name | type | desc |
---|---|---|
colIds | array | IDs of resized columns |
widths | array | Array that holds new widths |
⚪ resizecols
Column(s) have been resized.
name | type | desc |
---|---|---|
colIds | array | IDs of resized columns |
widths | array | Array that holds new widths |
⚪ beforeshowcols
Column(s) are about to be shown.
name | type | desc |
---|---|---|
colIds | array | Array of column IDs |
⚪ showcols
Column(s) are shown.
name | type | desc |
---|---|---|
colIds | array | Array of column IDs |
Actions: Row
⚪ beforedeleterows
Row(s) are about to be deleted. Return false to prevent the event.
name | type | desc |
---|---|---|
rowIds | array | IDs of deleted rows |
⚪ deleterows
Row(s) have been deleted.
name | type | desc |
---|---|---|
rowIds | array | IDs of deleted rows |
⚪ beforefreezerows
Row(s) are about to be frozen.
name | type | desc |
---|---|---|
rowId | rowlId | Row ID |
⚪ freezerows
Row(s) have been frozen.
name | type | desc |
---|---|---|
rowId | rowlId | Row ID |
⚪ beforehiderows
Row(s) are about to be hidden. Return false to prevent the event.
name | type | desc |
---|---|---|
rowIds | array | Array of row IDs |
⚪ hiderows
Row(s) have been hidden.
name | type | desc |
---|---|---|
rowIds | array | Array of row IDs |
⚪ beforeinsertrows
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. |
⚪ insertrows
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 |
⚪ beforemoverows
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 move new row(s) after. A targetId of 0 means that row(s) should be moved to the very start. |
⚪ moverows
Row(s) have been moved.
name | type | desc |
---|---|---|
rowIds | array | Array of moved row IDs |
targetId | rowId | ID of row to move new row(s) after. A targetId of 0 means that row(s) should be moved to the very start. |
⚪ beforeshowrows
Row(s) are about to be shown.
name | type | desc |
---|---|---|
rowIds | array | Array of row IDs |
⚪ showrows
Row(s) are shown.
name | type | desc |
---|---|---|
rowIds | array | Array of row IDs |
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.
Clipboard
⚪ beforecopy
Cell range 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 range has been copied.
name | type | desc |
---|---|---|
text | string | Copied values (Tab Seperated Values) |
cellRange | cellRange | Cell range that was copied |
⚪ beforecut
Cell range 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 range 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) |
Context Menu
closecontextmenu
Context Menu has been closed.
name | type | desc |
---|---|---|
contextMenu | object | Reference to contextMenu instance |
beforeopencontextmenu
Context Menu is about to be opened. Return false to prevent the event.
name | type | desc |
---|---|---|
snapPointX | int | Pixel position where contextMenu is displayed |
snapPointY | int | Pixel position where contextMenu is displayed |
contextMenu | object | Reference to contextMenu instance |
items | array | Context menu items |
opencontextmenu
Context Menu has been opened.
name | type | desc |
---|---|---|
snapPointX | int | Pixel position of contextMenu |
snapPointY | int | Pixel position of contextMenu |
contextMenu | object | Reference to contextMenu instance |
items | array | Context menu items |
Context Menu (touch)
closecontextmenutouch
Context Menu (touch) has been closed.
beforeopencontextmenutouch
Context Menu (touch) is about to be opened. Return false to prevent the event.
opencontextmenutouch
Context Menu (touch) has opened.
Layout
⚪ resize
Dimensions of grid container have changed.
name | type | desc |
---|---|---|
width | int | Component width in pixels |
height | int | Component height in pixels |
Lifecycle
🟠 ready
Grid is rendered and ready for interaction.
Selection
⚪ setcellcursorposition
Cell cursor position has changed.
name | type | desc |
---|---|---|
cellCursorPosition | cellCoords | Cell cursor position in cell coordinates {x,y} |
⚪ setselection
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.
name | type | desc |
---|---|---|
command | object | Command about to be redone. |
⚪ redo
Command has been redone.
name | type | desc |
---|---|---|
command | object | Command that has been redone. |
⚪ beforeundo
Command is about to be undone. Return false to prevent the event.
name | type | desc |
---|---|---|
command | object | Command about to be undone. |
⚪ undo
Command has been undone.
name | type | desc |
---|---|---|
command | object | Command that has been undone. |
Viewport
setviewportposition
Viewport position has changed.
name | type | desc |
---|---|---|
viewportPosition | cellCoords | Viewport position in cell coordinates {x,y} |