React Data Grid HiddenRows
Description
The HiddenRows
plugin lets you hide specified rows.
"Hiding a row" means that the hidden row doesn't get rendered as a DOM element.
The HiddenRows
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 |
---|---|---|---|---|
rows | No | Array | - | Hides specified rows by default |
indicators | No | Boolean | false | Shows UI indicators |
copyPasteEnabled | No | Boolean | true | Sets up copy/paste behavior |
Example
const hotRef = useRef(null);
...
<HotTable
ref={hotRef}
data={getData()}
hiddenRows={{
copyPasteEnabled: true,
indicators: true,
rows: [1, 2, 5]
}}
/>
// access the `HiddenRows` plugin's instance
const hot = hotRef.current.hotInstance;
const hiddenRowsPlugin = hot.getPlugin('hiddenRows');
// hide a single row
hiddenRowsPlugin.hideRow(1);
// hide multiple rows
hiddenRowsPlugin.hideRow(1, 2, 9);
// hide multiple rows as an array
hiddenRowsPlugin.hideRows([1, 2, 9]);
// unhide a single row
hiddenRowsPlugin.showRow(1);
// unhide multiple rows
hiddenRowsPlugin.showRow(1, 2, 9);
// unhide multiple rows as an array
hiddenRowsPlugin.showRows([1, 2, 9]);
// to see your changes, re-render your Handsontable instance
hot.render();
Options
hiddenRows
Source code (opens new window)hiddenRows.hiddenRows : boolean | object
The hiddenRows
option configures the HiddenRows
plugin.
You can set the hiddenRows
option to one of the following:
Setting | Description |
---|---|
false | Disable the HiddenRows plugin |
true | Enable the HiddenRows plugin with the default plugin options |
An object | - Enable the HiddenRows plugin- Modify the plugin options |
If you set the hiddenRows
to an object, you can set the following HiddenRows
plugin options:
Property | Possible values | Description |
---|---|---|
rows | An array of indexes | An array of indexes of rows that are hidden at initialization |
copyPasteEnabled | true | false | true : when copying or pasting data, take hidden rows into accountfalse : when copying or pasting data, don't take hidden rows into account |
indicators | true | false | true : display UI markers to indicate the presence of hidden rowsfalse : display UI markers |
Read more:
Default: undefined
Example
// enable the `HiddenRows` plugin
hiddenRows: true,
// enable `HiddenRows` plugin, and modify the plugin options
hiddenRows: {
// set rows that are hidden by default
rows: [5, 10, 15],
// when copying or pasting data, take hidden rows into account
copyPasteEnabled: true,
// show where hidden rows are
indicators: true
}
Methods
destroy
Source code (opens new window)hiddenRows.destroy()
Destroys the plugin instance.
disablePlugin
Source code (opens new window)hiddenRows.disablePlugin()
Disables the plugin functionality for this Handsontable instance.
enablePlugin
Source code (opens new window)hiddenRows.enablePlugin()
Enables the plugin functionality for this Handsontable instance.
getHiddenRows
Source code (opens new window)hiddenRows.getHiddenRows() ⇒ Array<number>
Returns an array of visual indexes of hidden rows.
hideRow
Source code (opens new window)hiddenRows.hideRow(...row)
Hides the row provided as row index (counting from 0).
Param | Type | Description |
---|---|---|
...row | number | Visual row index. |
hideRows
Source code (opens new window)hiddenRows.hideRows(rows)
Hides the rows provided in the array.
Param | Type | Description |
---|---|---|
rows | Array<number> | Array of visual row indexes. |
isEnabled
Source code (opens new window)hiddenRows.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
then the HiddenRows#enablePlugin method is called.
isHidden
Source code (opens new window)hiddenRows.isHidden(row) ⇒ boolean
Checks if the provided row is hidden.
Param | Type | Description |
---|---|---|
row | number | Visual row index. |
isValidConfig
Source code (opens new window)hiddenRows.isValidConfig(hiddenRows) ⇒ boolean
Checks whether all of the provided row indexes are within the bounds of the table.
Param | Type | Description |
---|---|---|
hiddenRows | Array | List of hidden visual row indexes. |
showRow
Source code (opens new window)hiddenRows.showRow(...row)
Shows the row provided as row index (counting from 0).
Param | Type | Description |
---|---|---|
...row | number | Visual row index. |
showRows
Source code (opens new window)hiddenRows.showRows(rows)
Shows the rows provided in the array.
Param | Type | Description |
---|---|---|
rows | Array<number> | Array of visual row indexes. |
updatePlugin
Source code (opens new window)hiddenRows.updatePlugin()
Updates the plugin's state.
This method is executed when updateSettings()
is invoked with any of the following configuration options: