This page covers a non-latest version of Handsontable.
# MergeCells
# Description
Plugin, which allows merging cells in the table (using the initial configuration, API or context menu).
Example
const hot = new Handsontable(document.getElementById('example'), {
data: getData(),
mergeCells: [
{row: 0, col: 3, rowspan: 3, colspan: 3},
{row: 2, col: 6, rowspan: 2, colspan: 2},
{row: 4, col: 8, rowspan: 3, colspan: 3}
],
# Options
# mergeCells
Source code (opens new window)mergeCells.mergeCells : boolean | Array<object>
If set to true
, it enables a possibility to merge cells. If set to an array of objects, it merges the cells provided
in the objects (see the example below). More information on the demo page.
Default: false
Example
// enables the mergeCells plugin
mergeCells: true,
// declares a list of merged sections
mergeCells: [
// rowspan and colspan properties declare the width and height of a merged section in cells
{row: 1, col: 1, rowspan: 3, colspan: 3},
{row: 3, col: 4, rowspan: 2, colspan: 2},
{row: 5, col: 6, rowspan: 3, colspan: 3}
],
# Methods
# clearCollections
Source code (opens new window)mergeCells.clearCollections()
Clears the merged cells from the merged cell container.
# disablePlugin
Source code (opens new window)mergeCells.disablePlugin()
Disables the plugin functionality for this Handsontable instance.
# enablePlugin
Source code (opens new window)mergeCells.enablePlugin()
Enables the plugin functionality for this Handsontable instance.
# isEnabled
Source code (opens new window)mergeCells.isEnabled() ⇒ boolean
Checks if the plugin is enabled in the handsontable settings. This method is executed in Hooks#beforeInit
hook and if it returns true
than the MergeCells#enablePlugin method is called.
# merge
Source code (opens new window)mergeCells.merge(startRow, startColumn, endRow, endColumn)
Merges the specified range.
Emits: Hooks#event:beforeMergeCells
, Hooks#event:afterMergeCells
Param | Type | Description |
---|---|---|
startRow | number | Start row of the merged cell. |
startColumn | number | Start column of the merged cell. |
endRow | number | End row of the merged cell. |
endColumn | number | End column of the merged cell. |
# mergeSelection
Source code (opens new window)mergeCells.mergeSelection([cellRange])
Merges the selection provided as a cell range.
Param | Type | Description |
---|---|---|
[cellRange] | CellRange | optional Selection cell range. |
# unmerge
Source code (opens new window)mergeCells.unmerge(startRow, startColumn, endRow, endColumn)
Unmerges the merged cell in the provided range.
Emits: Hooks#event:beforeUnmergeCells
, Hooks#event:afterUnmergeCells
Param | Type | Description |
---|---|---|
startRow | number | Start row of the merged cell. |
startColumn | number | Start column of the merged cell. |
endRow | number | End row of the merged cell. |
endColumn | number | End column of the merged cell. |
# unmergeSelection
Source code (opens new window)mergeCells.unmergeSelection([cellRange])
Unmerges the selection provided as a cell range.
Param | Type | Description |
---|---|---|
[cellRange] | CellRange | optional Selection cell range. |
# updatePlugin
Source code (opens new window)mergeCells.updatePlugin()
Updates the plugin state. This method is executed when Core#updateSettings is invoked.