React Data Grid Row trimming

Hide individual rows from your interface and exclude them from the rendering process and DataMap. This feature is similar to row hiding, but works a bit differently.

Overview

The TrimRows plugin allows the trimming of specific rows from the table. Rows being trimmed aren't rendered and aren't included in a DataMap, which can be retrieved by calling the getData method.

Setup

To enable row trimming, set the trimRows option to true.

// enable the `TrimRows` plugin

<HotTable
  trimRows={true}
/>

To both enable row trimming and trim selected rows at Handsontable's initialization, set the trimRows option to an array of physical row indexes.

// enable the `TrimRows` plugin
// at Handsontable's initialization, trim rows 5, 10, and 15

<HotTable
  trimRows={[5, 10, 15]}
/>

Example

Note that the second, third, and sixth rows are missing in the following example:

    API examples

    TIP

    To use the Handsontable API, you'll need access to the Handsontable instance. You can do that by utilizing a reference to the HotTable component, and reading its hotIntance property.

    For more information, see the Instance Methods page.

    The plugin instance can be accessed by calling:

    const plugin = hot.getPlugin('trimRows');
    

    To trim a single row, call the trimRow() method of the plugin object:

    plugin.trimRow(4);
    

    To trim multiple rows, either pass them as arguments to the trimRow() method, or pass an array of physical row indexes to the trimRows() method:

    plugin.trimRow(0, 4, 6);
    // or
    plugin.trimRows([0, 4, 6]);
    

    To restore the trimmed row(s), use the following methods:

    plugin.untrimRow(4);
    
    plugin.untrimRow(0, 4, 6);
    
    plugin.untrimRows([0, 4, 6]);
    

    To see the changes made, call hot.render(); to re-render the table.