Skip to content

Commit 9aa69e9

Browse files
committed
[update] what's new and docs for new Grid modules
1 parent 0272e3f commit 9aa69e9

9 files changed

+72
-13
lines changed

docs/grid/api/grid_blockselection_config.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,10 @@ description: You can explore the blockSelection config of Grid in the documentat
66

77
# blockSelection
88

9+
:::tip Pro version only
10+
This functionality requires PRO version of the DHTMLX Grid (or DHTMLX Suite) package.
11+
:::
12+
913
@short: Optional. Enables/disables block selection management within a grid
1014

1115
### Usage

docs/grid/api/grid_clipboard_config.md

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,10 +6,14 @@ description: You can explore the clipboard config of Grid in the documentation o
66

77
# clipboard
88

9-
@short: Optional. Enables/disables the clipboard module within a grid
9+
:::tip Pro version only
10+
This functionality requires PRO version of the DHTMLX Grid (or DHTMLX Suite) package.
11+
:::
12+
13+
@short: Optional. Enables/disables the [`Clipboard`](grid/usage_clipboard.md) module within a grid
1014

1115
:::note
12-
The module requires the `RangeSelection` module to be enabled via one of the configuration properties: `rangeSelection: true` or `blockSelection: { mode: "range" }`.
16+
The module requires the [`RangeSelection`](grid/usage_rangeselection.md) module to be enabled and is best used in conjunction with the [`BlockSelection`](grid/usage_blockselection.md) module in the `"range"` mode (enabled on initialization of the `Clipboard` module) for convenient range selection via the UI.
1317
:::
1418

1519
### Usage

docs/grid/api/grid_history_config.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,12 +6,12 @@ description: You can explore the history config of Grid in the documentation of
66

77
# history
88

9-
@short: Optional. Enables/disables the `History` module during the Grid initialization
10-
119
:::tip Pro version only
1210
This functionality requires PRO version of the DHTMLX Grid (or DHTMLX Suite) package.
1311
:::
1412

13+
@short: Optional. Enables/disables the `History` module during the Grid initialization
14+
1515
### Usage
1616

1717
~~~jsx

docs/grid/api/grid_rangeselection_config.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,10 @@ description: You can explore the rangeSelection config of Grid in the documentat
66

77
# rangeSelection
88

9+
:::tip Pro version only
10+
This functionality requires PRO version of the DHTMLX Grid (or DHTMLX Suite) package.
11+
:::
12+
913
@short: Optional. Enables/disables range selection management within a grid
1014

1115
### Usage

docs/grid/configuration.md

Lines changed: 32 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2189,7 +2189,24 @@ This functionality requires PRO version of the DHTMLX Grid (or DHTMLX Suite) pac
21892189
21902190
The [`DragPanel`](grid/usage_dragpanel.md) module allows configuring the drag-n-drop functionality in Grid. It provides settings for adjusting the appearance of the drag panel that appears when the drag-n-drop functionality is activated.
21912191
2192-
To initialize the `DragPanel` module, enable the [`dragPanel`](grid/api/grid_dragpanel_config.md) property in the Grid configuration. The module is automatically enabled if the [row Drag-and-Drop](grid/configuration.md/#drag-n-drop) is active (e.g., `dragItem: "row"` or `dragItem: "both"`) and either the [`BlockSelection`](grid/usage_blockselection.md) or [`Clipboard`](grid/usage_clipboard.md) modules are enabled.
2192+
To initialize the `DragPanel` module, enable the [`dragPanel`](grid/api/grid_dragpanel_config.md) property in the Grid configuration.
2193+
2194+
~~~jsx
2195+
const grid = new dhx.Grid("grid_container", {
2196+
columns: [
2197+
{ id: "a", header: [{ text: "A" }] },
2198+
{ id: "b", header: [{ text: "B" }] },
2199+
],
2200+
data: [
2201+
{ id: "1", a: "A1", b: "B1" },
2202+
{ id: "2", a: "A2", b: "B2" },
2203+
],
2204+
dragItem: "row", // enables row Drag-and-Drop
2205+
dragPanel: true // enables the DragPanel module
2206+
});
2207+
~~~
2208+
2209+
The module is automatically enabled if the [row Drag-and-Drop](grid/configuration.md/#drag-n-drop) is active (e.g., `dragItem: "row"` or `dragItem: "both"`) and either the [`BlockSelection`](grid/usage_blockselection.md) or [`Clipboard`](grid/usage_clipboard.md) modules are enabled.
21932210
21942211
This example demonstrates enabling the `DragPanel` module with row Drag-and-Drop and the `BlockSelection` module:
21952212
@@ -2484,6 +2501,10 @@ A range of Grid cells/rows can be selected by clicking the first element to sele
24842501
24852502
### Managing range selection in Grid
24862503
2504+
:::tip Pro version only
2505+
This functionality requires PRO version of the DHTMLX Grid (or DHTMLX Suite) package.
2506+
:::
2507+
24872508
The Grid functionality provides the [range selection management](grid/usage_rangeselection.md) feature for setting/resetting a range of cells, retrieving information about the current range, and checking whether specific cells belong to the selected range.
24882509
24892510
To enable [range selection management](grid/usage_rangeselection.md) within a grid, you should use the `RangeSelection` module. To initialize the module, enable the [`rangeSelection`](grid/api/grid_rangeselection_config.md) property in the Grid configuration:
@@ -2532,6 +2553,10 @@ For information on using the Range Selection API, read the [Work with RangeSelec
25322553

25332554
### Managing block selection in Grid
25342555

2556+
:::tip Pro version only
2557+
This functionality requires PRO version of the DHTMLX Grid (or DHTMLX Suite) package.
2558+
:::
2559+
25352560
The Grid functionality provides the [block selection management](grid/usage_blockselection.md) feature for selecting cells' ranges via the mouse pointer, touch input, and keyboard navigation, as well as adjusting the appearance of the selection and handlers, depending on the applied mode.
25362561
25372562
To enable managing of the block selection within a grid, you should use the `BlockSelection` module. To initialize the module, enable the [`blockSelection`](grid/api/grid_blockselection_config.md) property in the Grid configuration:
@@ -2639,6 +2664,10 @@ For information on using the Block Selection API, read the [Work with Block Sele
26392664
26402665
## Clipboard
26412666
2667+
:::tip Pro version only
2668+
This functionality requires PRO version of the DHTMLX Grid (or DHTMLX Suite) package.
2669+
:::
2670+
26422671
The Grid component provides the [functionality for interacting with the clipboard](grid/usage_clipboard.md), such as copying, cutting, and pasting data from a selected range of cells, as well as integrating with other grids or external applications like Google Spreadsheets.
26432672
26442673
To enable the clipboard functionality within a grid, you should use the `Clipboard` module. To initialize the module, enable the [`clipboard`](grid/api/grid_clipboard_config.md) property in the Grid configuration.
@@ -2715,12 +2744,12 @@ For information on working with Clipboard, read the [Work with Clipboard module]
27152744
27162745
## History of Grid actions
27172746
2718-
DHTMLX Grid provides the functionality for managing the history of actions in the component.
2719-
27202747
:::tip Pro version only
27212748
This functionality requires PRO version of the DHTMLX Grid (or DHTMLX Suite) package.
27222749
:::
27232750
2751+
DHTMLX Grid provides the functionality for managing the history of actions in the component.
2752+
27242753
To enable the history functionality within a grid, you should use the `History` module. To initialize the module, enable the [`history`](grid/api/grid_history_config.md) property in the Grid configuration.
27252754
27262755
~~~jsx

docs/grid/usage_blockselection.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,10 @@ description: You can explore how to work with BlockSelection module of Grid in t
66

77
# Work with BlockSelection module
88

9+
:::tip Pro version only
10+
This functionality requires PRO version of the DHTMLX Grid (or DHTMLX Suite) package.
11+
:::
12+
913
You can manage block selection within a grid via the API of the [`BlockSelection`](grid/configuration.md/#managing-block-selection-in-grid) module. It allows selecting ranges of cells using the mouse pointer, touch input, or keyboard navigation, visualizing the selection, and controlling behavior through various modes and handlers. It also supports an [event system](grid/api/api_overview.md/#blockselection-events) to track user actions, including keyboard and mouse combinations.
1014

1115
To initialize the `BlockSelection` module, use the [`blockSelection`](grid/api/grid_blockselection_config.md) property in the Grid configuration. Once the Grid is created, the module is accessible through the `grid.block` property.

docs/grid/usage_clipboard.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,10 @@ description: You can explore how to work with Clipboard module of Grid in the do
66

77
# Work with Clipboard module
88

9+
:::tip Pro version only
10+
This functionality requires PRO version of the DHTMLX Grid (or DHTMLX Suite) package.
11+
:::
12+
913
You can manage the clipboard functionality within a grid via the API of the [`Clipboard`](grid/configuration.md/#clipboard) module. It enables copying, cutting, and pasting data from a selected range of cells. Besides, it allows integrating with other grids or external applications like Google Spreadsheets.
1014

1115
## Initializing the Clipboard module

docs/grid/usage_rangeselection.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,10 @@ description: You can explore how to work with RangeSelection module of Grid in t
66

77
# Work with RangeSelection module
88

9+
:::tip Pro version only
10+
This functionality requires PRO version of the DHTMLX Grid (or DHTMLX Suite) package.
11+
:::
12+
913
You can manage range selection within a grid via the API of the [`RangeSelection`](grid/configuration.md/#managing-range-selection-in-grid) module. It provides methods for setting and resetting a range of cells, getting information about the current range, and checking whether specific cells belong to the selected range. It also supports an [event system](grid/api/api_overview.md/#rangeselection-events) to track changes.
1014

1115
To initialize the `RangeSelection` module, use the [`rangeSelection`](grid/api/grid_rangeselection_config.md) property in the Grid configuration. Once the Grid is created, the module is accessible through the `grid.range` property.

docs/whatsnew.md

Lines changed: 12 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -16,24 +16,30 @@ Released on June X, 2025
1616

1717
### New functionality
1818

19-
- Grid. The `RangeSelection` manager is added (PRO version)
19+
- Grid. The [`RangeSelection` module](grid/usage_rangeselection.md) is added to provide functionality for managing range selection in Grid (PRO version)
2020
- new Grid configuration property: [`rangeSelection`](grid/api/grid_rangeselection_config.md)
2121
- new methods of the `range` object: [`disable()`](grid/api/rangeselection/disable_method.md), [`enable()`](grid/api/rangeselection/enable_method.md), [`getRange()`](grid/api/rangeselection/getrange_method.md), [`getRangedCells()`](grid/api/rangeselection/getrangedcells_method.md), [`isDisabled()`](grid/api/rangeselection/isdisabled_method.md), [`isRanged()`](grid/api/rangeselection/isranged_method.md), [`resetRange()`](grid/api/rangeselection/resetrange_method.md), [`setRange()`](grid/api/rangeselection/setrange_method.md)
2222
- new events of the `range` object: [`afterResetRange`](grid/api/rangeselection/afterresetrange_event.md), [`afterSetRange`](grid/api/rangeselection/aftersetrange_event.md), [`beforeResetRange`](grid/api/rangeselection/beforeresetrange_event.md), [`beforeSetRange`](grid/api/rangeselection/beforesetrange_event.md)
23-
- Grid. The `BlockSelection` manager is added (PRO version)
23+
- Grid. The [`BlockSelection` module](grid/usage_blockselection.md) is added to provide functionality for managing block selection in Grid (PRO version)
2424
- new Grid configuration property: [`blockSelection`](grid/api/grid_blockselection_config.md)
2525
- new methods of the `block` object: [`disable()`](grid/api/blockselection/disable_method.md), [`enable()`](grid/api/blockselection/enable_method.md), [`isDisabled()`](grid/api/blockselection/isdisabled_method.md)
2626
- new events of the `block` object: [`afterBlockHandleApply`](grid/api/blockselection/afterblockhandleapply_event.md), [`afterBlockSelectionApply`](grid/api/blockselection/afterblockselectionapply_event.md), [`afterBlockSelectionMove`](grid/api/blockselection/afterblockselectionmove_event.md), [`beforeBlockHandleApply`](grid/api/blockselection/beforeblockhandleapply_event.md), [`beforeBlockSelectionApply`](grid/api/blockselection/beforeblockselectionapply_event.md), [`beforeBlockSelectionMove`](grid/api/blockselection/beforeblockselectionmove_event.md), [`blockHandleMouseDown`](grid/api/blockselection/blockhandlemousedown_event.md), [`blockSelectionEnd`](grid/api/blockselection/blockselectionend_event.md), [`blockSelectionStart`](grid/api/blockselection/blockselectionstart_event.md), [`blockSelectionValidate`](grid/api/blockselection/blockselectionvalidate_event.md)
27-
- Grid. The `Clipboard` module is added (PRO version)
27+
- Grid. The [`Clipboard` module](grid/usage_clipboard.md) is added to provide functionality for interacting with the clipboard in Grid (PRO version)
2828
- new Grid configuration property: [`clipboard`](grid/api/grid_clipboard_config.md)
2929
- new events of the `clipboard` object: [`afterCopy`](grid/api/clipboard/aftercopy_event.md), [`afterPaste`](grid/api/clipboard/afterpaste_event.md), [`beforeCopy`](grid/api/clipboard/beforecopy_event.md), [`beforePaste`](grid/api/clipboard/beforepaste_event.md), [`copyError`](grid/api/clipboard/copyerror_event.md), [`pasteError`](grid/api/clipboard/pasteerror_event.md)
30-
- Grid. The drag and drop handle (panel) for rows is added
31-
- Grid. Undo/Redo functionality
30+
- Grid. The [`DragPanel` module](grid/usage_dragpanel.md) is added to provide auxiliary functionality for moving rows in Grid (PRO version)
31+
- new Grid configuration property: [`dragPanel`](grid/api/grid_dragpanel_config.md)
32+
- new events: [`dragPanelItemClick`](grid/api/dragpanel/dragpanelitemclick_event.md), [`dragPanelItemMouseDown`](grid/api/dragpanel/dragpanelitemmousedown_event.md)
33+
- Grid. The [`History` module](grid/usage_history.md) is added to provide functionality for managing the history of actions in Grid, including the [Undo/Redo functionality](grid/usage_history.md/#applying-undoredo-operations-to-grid-history-actions) (PRO version)
34+
- new Grid configuration property: [`history`](grid/api/grid_history_config.md)
35+
- new methods of the `history` object: [`add()`](grid/api/history/add_method.md), [`canRedo()`](grid/api/history/canredo_method.md), [`canUndo()`](grid/api/history/canundo_method.md), [`disable()`](grid/api/history/disable_method.md), [`enable()`](grid/api/history/enable_method.md), [`isDisabled()`](grid/api/history/isdisabled_method.md), [`getHistory()`](grid/api/history/gethistory_method.md), [`redo()`](grid/api/history/redo_method.md), [`remove()`](grid/api/history/remove_method.md), [`removeAll()`](grid/api/history/removeall_method.md), [`undo()`](grid/api/history/undo_method.md)
36+
- new events of the `history` object: [`afterAdd`](grid/api/history/afteradd_event.md), [`afterRedo`](grid/api/history/afterredo_event.md), [`afterUndo`](grid/api/history/afterundo_event.md), [`beforeAdd`](grid/api/history/beforeadd_event.md), [`beforeRedo`](grid/api/history/beforeredo_event.md), [`beforeUndo`](grid/api/history/beforeundo_event.md), [`error`](grid/api/history/error_event.md)
3237

3338
### Updates
3439

3540
- Context Menu. The `navigationType:"click"` is added
36-
- Grid. The drag-n-drop functionality is improved (The DropManager is added)
41+
- Grid. The logic and appearance of the drag-n-drop functionality is improved (the `DropManager` module is added)
42+
- Grid. The [`isSelected()`](grid/api/selection/selection_isselectedcell_method.md) method is added for the [`Selection` module](grid/usage_selection.md) to check whether the specified cell is selected
3743
- Grid. Updating / improving the export to Excel module
3844
- Grid. The possibility to clear data while editing a cell by using the `Delete` shortcut key is added
3945

0 commit comments

Comments
 (0)