# Selection

> Enable row selection, read selected IDs in React, and run bulk actions on them.

Source: https://docs.inertiax.dev/table/guide/selection/

Enable checkboxes with `selection()`:

**Laravel**

```php
UsersTable::make('users')->data($users)->selection();
```

## Select one row

**Laravel**

```php
use InertiaX\Table\Enums\SelectionMode;

UsersTable::make('users')
    ->data($users)
    ->selection()
    ->selectionMode(SelectionMode::Single);
```

The default mode is `SelectionMode::Multiple`. The fluent method also accepts `'single'` or `'multiple'`.

## Read the selected IDs

**React**

```tsx
<AppTable
  prop="users"
  customization={{
    events: {
      selectionChange({ selection }) {
        console.log(selection);
      },
    },
  }}
/>
```

Selection is local to the current result page. A new result removes IDs that are no longer present, so it does not persist as a cross-page list. An empty selection is valid.

Use the [controller](https://docs.inertiax.dev/table/guide/controller-events/) to set or clear selection. To observe changes caused by a server result as well as user interaction, listen to `stateChange`.

## Act on the selected rows

Selection does not perform an action. Handle a bulk action, such as archiving the selected users, in an ordinary route that authorizes it like any other request; see [Authorization & security](https://docs.inertiax.dev/table/guide/security/#validate-actions-independently). A toolbar region receives the table’s state and controller, so it can send the selected IDs there:

**Laravel**

routes/web.php

```php
use App\Models\User;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Gate;

Route::post('users/archive', function (Request $request) {
    $ids = $request->validate(['ids' => ['required', 'array'], 'ids.*' => ['integer']])['ids'];
    // The selection only names the ticked rows: authorize the operation here.
    Gate::authorize('archive-users');
    User::query()->whereKey($ids)->update(['archived_at' => now()]);

    return back();
})->middleware(['auth']);
```

**React**

```tsx
import { router } from '@inertiajs/react';
import type { TableRegionProps } from '@inertiax/react-table';
import { AppTable } from '@/components/app-table';

function ArchiveSelected({ state, controller }: TableRegionProps) {
  return (
    <button
      type="button"
      disabled={state.selection.length === 0}
      onClick={() =>
        router.post('/users/archive', { ids: [...state.selection] }, {
          preserveScroll: true,
          onSuccess: () => controller.clearSelection(),
        })
      }
    >
      Archive {state.selection.length} selected
    </button>
  );
}

<AppTable prop="users" customization={{ regions: { beforeToolbar: ArchiveSelected } }} />;
```

This example assumes an `archived_at` column and an `archive-users` gate in your application. After the redirect, the page receives the table’s new result.