MergeCells

Feature

By default, merged cells allow pointer events to pass through to the underlying row/cell, to allow selecting a row and editing an individual cell even when they are merged. Configure as false to allow merged cells to catch and react to the pointer events instead.

const grid = new Grid({
    features : {
        mergeCells : {
            // Let merged cells react to pointer events
            passthrough : false
        }
    }
});

Has a corresponding runtime passthrough property.

Hook used to control which cells should be included in a merged range of cells.

The feature first determines the range using its default logic. It then calls this hook for each cell in the range except the first, and if the hook returns false, the cell is not included in the range but instead a new range is started. The hook thus controls if a cell should be merged with the cell above it or not.

Example usage:

const grid = new Grid({
   features : {
       mergeCells : {
           shouldMerge({ column, record, previousRecord, value }) {
               // Only merge cells in the "Age" column as long as the "Name" matches the previous record
               if (column.field === 'age') {
                   return record.name === previousRecord.name;
               }

               // Merge other cells as usual
               return true;
           }
       }
   }
});

Has a corresponding runtime shouldMerge property.

Configure as false to allow merging cells in columns that are not sorted.

Has a corresponding runtime sortedOnly property.