|
| 1 | +--- |
| 2 | +sidebar_label: Spreadsheet actions |
| 3 | +title: Actions Overview |
| 4 | +description: You can have an Actions overview of the DHTMLX JavaScript Spreadsheet library in the documentation. Browse developer guides and API reference, try out code examples and live demos, and download a free 30-day evaluation version of DHTMLX Spreadsheet. |
| 5 | +--- |
| 6 | + |
| 7 | +# Actions overview |
| 8 | + |
| 9 | +This section is dedicated to a new conception of interaction with Spreadsheet events. |
| 10 | + |
| 11 | +Starting from v4.3, DHTMLX Spreadsheet includes a pair of the [beforeAction](api/spreadsheet_beforeaction_event.md)/[afterAction](api/spreadsheet_afteraction_event.md) events that are intended to make your code simple and concise. They will fire right before an action is executed and indicate which exactly action has been performed. |
| 12 | + |
| 13 | +~~~js |
| 14 | +spreadsheet.events.on("beforeAction", (actionName, config) => { |
| 15 | + if (actionName === "addColumn") { |
| 16 | + console.log(actionName, config); |
| 17 | + return false; |
| 18 | + }, |
| 19 | + // more actions |
| 20 | +}); |
| 21 | + |
| 22 | +spreadsheet.events.on("afterAction", (actionName, config) => { |
| 23 | + if (actionName === "addColumn") { |
| 24 | + console.log(actionName, config) |
| 25 | + }, |
| 26 | + // more actions |
| 27 | +}); |
| 28 | +~~~ |
| 29 | + |
| 30 | +[The full list of the available actions is given below.](#list-of-actions) |
| 31 | + |
| 32 | +>It means, that you don't have to constantly add sets of paired [**before-** and **after-**](api/overview/events_overview.md) events anymore to track and handle the actions which you execute when changing something in the spreadsheet. |
| 33 | +
|
| 34 | +>But if needed you can use an **old approach** because all the existing events will continue work as before: |
| 35 | +~~~js |
| 36 | +spreadsheet.events.on("afterColumnAdd", function(cell){ |
| 37 | + console.log("A new column is added", cell); |
| 38 | +}); |
| 39 | +~~~ |
| 40 | +~~~js |
| 41 | +spreadsheet.events.on("beforeColumnAdd", function(cell){ |
| 42 | + console.log("A new column will be added", cell); |
| 43 | + return true; |
| 44 | +}); |
| 45 | +~~~ |
| 46 | + |
| 47 | + |
| 48 | + |
| 49 | + |
| 50 | +## List of actions |
| 51 | + |
| 52 | +| Action | Description | |
| 53 | +| ------------------ | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | |
| 54 | +| **addColumn** | The action is executed when you add a new column | |
| 55 | +| **addRow** | The action is executed when you add a new row | |
| 56 | +| **addSheet** | The action is executed when you add a new sheet | |
| 57 | +| **clear** | The action is executed when you clear the spreadsheet via the <b>clear()</b> method | |
| 58 | +| **clearSheet** | The action is executed when you clear a sheet via the <b>clearSheet()</b> method | |
| 59 | +| **deleteColumn** | The action is executed when you remove a column | |
| 60 | +| **deleteRow** | The action is executed when you remove a row | |
| 61 | +| **deleteSheet** | The action is executed when you remove a sheet | |
| 62 | +| **groupAction** | The action is executed when you select a range of cells and apply to them some actions (for instance, change the style or format of cells, lock/unlock the cells, clear cells' value or styles, etc.) | |
| 63 | +| **lockCell** | The action is executed when you lock/unlock a cell | |
| 64 | +| **removeCellStyles** | The action is executed when you clear styles of a cell | |
| 65 | +| **renameSheet** | The action is executed when you rename a sheet | |
| 66 | +| **resizeCol** | The action is executed when you resize a column | |
| 67 | +| **resizeRow** | The action is executed when you resize a row | |
| 68 | +| **setCellFormat** | The action is executed when you change the format of a cell | |
| 69 | +| **setCellValue** | The action is executed when you change or remove the value of a cell | |
| 70 | +| **setValidation** | The action is executed when you set data validation for a cell | |
| 71 | +| **sortCells** | The action is executed when you sort data in spreadsheet | |
| 72 | +| **setCellStyle** | The action is executed when you change the style of a cell | |
| 73 | + |
| 74 | +**Related sample:** [Spreadsheet. Actions](https://snippet.dhtmlx.com/efcuxlkt) |
0 commit comments