This page covers a next version of Handsontable, and is not published yet.

This page covers a non-latest version of Handsontable.

# HiddenRows

# Description

Plugin allows to hide certain rows. Hidden rows are not rendered as DOM elements. The plugin doesn't modify the source data and doesn't participate in data transformation (the shape of data returned by getData* methods stays intact).

Possible plugin settings:

  • copyPasteEnabled as Boolean (default true)
  • rows as Array
  • indicators as Boolean (default false).

Example

const container = document.getElementById('example');
const hot = new Handsontable(container, {
  data: getData(),
  hiddenRows: {
    copyPasteEnabled: true,
    indicators: true,
    rows: [1, 2, 5]
  }
});

// access to hiddenRows plugin instance
const hiddenRowsPlugin = hot.getPlugin('hiddenRows');

// show single row
hiddenRowsPlugin.showRow(1);

// show multiple rows
hiddenRowsPlugin.showRow(1, 2, 9);

// or as an array
hiddenRowsPlugin.showRows([1, 2, 9]);

// hide single row
hiddenRowsPlugin.hideRow(1);

// hide multiple rows
hiddenRowsPlugin.hideRow(1, 2, 9);

// or as an array
hiddenRowsPlugin.hideRows([1, 2, 9]);

// rerender the table to see all changes
hot.render();

# Options

# hiddenRows

Source code (opens new window)

hiddenRows.hiddenRows : boolean | object

The HiddenRows plugin allows hiding of certain rows. You can pass additional configuration with an object notation. Options that are then available are:

  • rows - an array of rows that should be hidden on plugin initialization
  • indicators - enables small ui markers to indicate where are hidden columns.

Default: undefined Example

// enable row hiding
hiddenRows: true,

// or
hiddenRows: {
  // set rows that are hidden by default
  rows: [5, 10, 15],
  // show where are hidden rows
  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 than 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 state. This method is executed when Core#updateSettings is invoked.

Last Updated: Apr 12, 2024