# Row Selection
URL: https://pro.rv-grid.com/guides/gantt/interaction/row-selection/
Source: src/content/docs/guides/gantt/interaction/row-selection.mdx
Description: Use RowSelectPlugin with Gantt task operations and row reordering.
`GanttPlugin` can work with the RevoGrid Pro `RowSelectPlugin` when you want checkbox-based task selection in the task table.

Add a row-select column, register `RowSelectPlugin`, and enable the row-order bridge when selected rows should move together during Gantt row reordering.

```ts
import { GanttPlugin, isGanttAddTaskRow } from '@revolist/revogrid-enterprise';
import { RowSelectPlugin } from '@revolist/revogrid-pro';

const grid = document.querySelector('revo-grid');

grid.plugins = [GanttPlugin, RowSelectPlugin];
grid.rowSelect = {
  rowOrder: true,
};
grid.columns = [
  {
    prop: 'selected',
    name: '',
    rowSelect: ({ model }) => !isGanttAddTaskRow(model),
    size: 56,
    readonly: true,
    filter: false,
  },
  // Task table columns...
];
```

The checkbox column uses physical task rows from `grid.source`. Gantt ignores resource rows and non-task rows when resolving checkbox selection for task operations.

Use `isGanttAddTaskRow()` when `taskCreateRow` is enabled so the pinned “Add new task” row does not render a checkbox. See [Add Task Row](/guides/gantt/interaction/add-task-row/) for the draft-row contract.

## Bulk Gantt Operations

When no explicit task ids are passed, Gantt resolves task ids in this order:

1. Checkbox-selected rows from `RowSelectPlugin`.
2. Gantt task range selection.
3. The currently focused or selected Gantt task.

This means toolbar buttons, context-menu actions, keyboard handlers, or application code can call the existing Gantt methods without manually collecting checkbox state:

```ts
const plugins = await grid.getPlugins();
const gantt = plugins.find((plugin) => plugin instanceof GanttPlugin);

gantt?.deleteTasks();
gantt?.indentTasks();
gantt?.outdentTasks();
gantt?.convertTasksToMilestones();
```

After a successful delete, Gantt clears the row-select checkbox state for task rows so removed tasks do not remain selected in `RowSelectPlugin`.

## Row Reordering

Gantt installs `RowOrderPlugin` internally. `RowSelectPlugin` does not automatically move all checked rows unless the row-select row-order integration is enabled:

```ts
grid.rowSelect = {
  rowOrder: true,
};
```

With `rowOrder: true`, dragging a checked task row moves the visible checked task rows as one compact block. Dragging an unchecked row keeps the normal Gantt row-order behavior.

## Framework Bindings

React:

```tsx
<RevoGrid
  plugins={[GanttPlugin, RowSelectPlugin]}
  rowSelect={{ rowOrder: true }}
  columns={[
    {
      prop: 'selected',
      name: '',
      rowSelect: ({ model }) => !isGanttAddTaskRow(model),
      size: 56,
      readonly: true,
      filter: false,
    },
    ...taskColumns,
  ]}
/>
```

Vue:

```vue
<RevoGrid
  :plugins="plugins"
  :row-select.prop="{ rowOrder: true }"
  :columns="columns"
/>
```

Angular:

```html
<revo-grid
  [plugins]="plugins"
  [rowSelect]="{ rowOrder: true }"
  [columns]="columns"
></revo-grid>
```

For Vue Gantt examples, use `.prop` for `row-select` because it is a direct grid plugin property.
