Свойство **showGroupingPanel** позволяет отобразить дополнительную панель, с помощью которой можно выполнить группировку строк таблицы.

На эту панель можно перетащить любой столбец, схватившись за его заголовок левой кнопкой мыши. В результате этого все строки таблицы будут сгруппированы по значениям ячеек этого столбца.

Для отображения группировочной панели необходимо свойство **show-grouping-panel** установить в значение **true**. Кроме этого, заголовки столбцов должны быть доступны для перетаскивания, т.е. свойства **showHeader** необходимо первоначально установить в значение **true**.

Например:

```javascript _run_line_edit_loadoda_[my-component.js]_h=220_
import '/components/grids/table/table.js';
ODA({
    is: 'my-component',
    template: `
        <label>Показать панель группировки <input type="checkbox" ::value="showGroupingPanel" ></label>
        <oda-table :show-grouping-panel :data-set :columns show-header row-lines col-lines auto-width></oda-table>
    `,
    props: {
        columns: [
            {name: 'col1', label: 'Столбец 1'},
            {name: 'col2', label: 'Столбец 2'}
        ],
        dataSet: [
            {col1: "1 Строка", col2: "1"},
            {col1: "2 Строка", col2: "2"},
            {col1: "1 Строка", col2: "2"}
        ],
        showGroupingPanel: false
    }
});
```

По умолчанию свойство **showGroupingPanel** установлено в значение **false**. Поэтому группировочная панель изначально не отображается.

Однако если столбец уже сгруппирован, то саму панели можно убрать, установив свойство **showGroupingPanel** в значение **false**. При этом группировка не будет отменена. Отменить ее можно только удалив столбец с панели, нажав на кнопку с изображением крестика в его названии.

Если массив **columns** не задан, то перетащить столбец на панель группировки будет нельзя.
