# Single Row Selection

Enable single-row selection by setting the [`enabled`](https://www.telerik.com/kendo-vue-ui-develop/components/grid/api/gridselectablesettings#enabled) prop of [`GridSelectableSettings`](https://www.telerik.com/kendo-vue-ui-develop/components/grid/api/gridselectablesettings) to `true` and its [`mode`](https://www.telerik.com/kendo-vue-ui-develop/components/grid/api/gridselectablesettings#mode) prop to `single`.

```vue
<Grid :selectable="{ enabled: true, mode: 'single' }" />
```

The following example demonstrates how to enable the single-row selection of the Grid where the `select` state is handled internally by the Grid.

[Demo Source](https://demos.telerik.com/kendo-vue-ui/grid/selection/row-selection/source.txt)

## Checkbox Selection

The Grid supports single-row selection through checkboxes and row clicks.

To configure the checkbox selection:

1. Configure the [`GridSelectableSettings`](https://www.telerik.com/kendo-vue-ui-develop/components/grid/api/gridselectablesettings) as follows:

   ```html
   <Grid
       :selectable="{
           enabled: true,
           drag: false,
           cell: false,
           mode: 'single'
       }"
   >
   ```

2. Add a column with `columnType` set to `checkbox`.

3. Bind the [`select`](https://www.telerik.com/kendo-vue-ui-develop/components/grid/api/gridprops#select) prop and update it in the [`selectionchange`](https://www.telerik.com/kendo-vue-ui-develop/components/grid/api/gridprops#onselectionchange) and [`headerselectionchange`](https://www.telerik.com/kendo-vue-ui-develop/components/grid/api/gridprops#onheaderselectionchange) event handlers.

The following example demonstrates single-row checkbox selection with controlled state management.

[Demo Source](https://demos.telerik.com/kendo-vue-ui/grid/selection/checkboxes/source.txt)

## Persisting Checkbox Selection

The `select` state object maps `dataItemKey` values to booleans, so you can serialize it with `JSON.stringify` and store it in `localStorage`. When initialized, the example reads the saved selection from storage and passes it to the `select` prop.

The following example demonstrates this pattern. Use the **Save Selection** button to write the current selection to `localStorage`, and **Load Selection** to read it back. A saved selection also persists after a page refresh.

[Demo Source](https://demos.telerik.com/kendo-vue-ui/grid/selection/persisting-checkbox-selection/source.txt)

## Suggested Links

* [Grid API Reference](https://www.telerik.com/kendo-vue-ui-develop/components/grid/api/gridprops)
* [Grid API Index](https://www.telerik.com/kendo-vue-ui-develop/components/grid/api)
