This page covers a non-latest version of Handsontable.
# HiddenColumns
# Description
The HiddenColumns plugin lets you hide specified columns.
"Hiding a column" means that the hidden column doesn't get rendered as a DOM element.
The HiddenColumns plugin doesn't modify the source data,
and doesn't participate in data transformation
(the shape of the data returned by the getData*() methods stays intact).
You can set the following configuration options:
| Option | Required | Type | Default | Description |
|---|---|---|---|---|
columns | No | Array | - | Hides specified columns by default |
indicators | No | Boolean | false | Shows UI indicators |
copyPasteEnabled | No | Boolean | true | Sets up copy/paste behavior |
Example
const container = document.getElementById('example');
const hot = new Handsontable(container, {
data: getData(),
hiddenColumns: {
copyPasteEnabled: true,
indicators: true,
columns: [1, 2, 5]
}
});
// access the `HiddenColumns` plugin's instance
const hiddenColumnsPlugin = hot.getPlugin('hiddenColumns');
// hide a single column
hiddenColumnsPlugin.hideColumn(1);
// hide multiple columns
hiddenColumnsPlugin.hideColumn(1, 2, 9);
// hide multiple columns as an array
hiddenColumnsPlugin.hideColumns([1, 2, 9]);
// unhide a single column
hiddenColumnsPlugin.showColumn(1);
// unhide multiple columns
hiddenColumnsPlugin.showColumn(1, 2, 9);
// unhide multiple columns as an array
hiddenColumnsPlugin.showColumns([1, 2, 9]);
// to see your changes, re-render your Handsontable instance
hot.render();
# Options
# hiddenColumns
Source code (opens new window)hiddenColumns.hiddenColumns : boolean | object
The hiddenColumns option enables and configures the HiddenColumns plugin.
To enable the HiddenColumns plugin, set the hiddenColumns option to true.
To enable the HiddenColumns plugin and configure its settings, set the hiddenColumns option to an object with the following properties:
columns: An array of indexes of columns that are hidden on plugin initialization.copyPasteEnabled: When set totrue, takes hidden columns into account when copying or pasting data.indicators: When set totrue, displays UI markers to indicate the presence of hidden columns.
Default: undefined Example
// enable the `HiddenColumns` plugin
hiddenColumns: true,
// or enable `HiddenColumns` plugin, and configure its settings
hiddenColumns: {
// set columns that are hidden by default
columns: [5, 10, 15],
// take hidden columns into account when copying or pasting
copyPasteEnabled: true,
// show where hidden columns are
indicators: true
}
# Methods
# destroy
Source code (opens new window)hiddenColumns.destroy()
Destroys the plugin instance.
# disablePlugin
Source code (opens new window)hiddenColumns.disablePlugin()
Disables the plugin functionality for this Handsontable instance.
# enablePlugin
Source code (opens new window)hiddenColumns.enablePlugin()
Enables the plugin functionality for this Handsontable instance.
# getHiddenColumns
Source code (opens new window)hiddenColumns.getHiddenColumns() ⇒ Array<number>
Returns an array of visual indexes of hidden columns.
# hideColumn
Source code (opens new window)hiddenColumns.hideColumn(...column)
Hides a single column.
| Param | Type | Description |
|---|---|---|
| ...column | number | Visual column index. |
# hideColumns
Source code (opens new window)hiddenColumns.hideColumns(columns)
Hides the columns provided in the array.
| Param | Type | Description |
|---|---|---|
| columns | Array<number> | Array of visual column indexes. |
# isEnabled
Source code (opens new window)hiddenColumns.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 HiddenColumns#enablePlugin method is called.
# isHidden
Source code (opens new window)hiddenColumns.isHidden(column) ⇒ boolean
Checks if the provided column is hidden.
| Param | Type | Description |
|---|---|---|
| column | number | Visual column index. |
# isValidConfig
Source code (opens new window)hiddenColumns.isValidConfig(hiddenColumns) ⇒ boolean
Get if trim config is valid. Check whether all of the provided column indexes are within the bounds of the table.
| Param | Type | Description |
|---|---|---|
| hiddenColumns | Array | List of hidden column indexes. |
# showColumn
Source code (opens new window)hiddenColumns.showColumn(...column)
Shows a single column.
| Param | Type | Description |
|---|---|---|
| ...column | number | Visual column index. |
# showColumns
Source code (opens new window)hiddenColumns.showColumns(columns)
Shows the provided columns.
| Param | Type | Description |
|---|---|---|
| columns | Array<number> | Array of visual column indexes. |
# updatePlugin
Source code (opens new window)hiddenColumns.updatePlugin()
Updates the plugin state. This method is executed when Core#updateSettings is invoked.
← Formulas HiddenRows →