`<vaadin-grid-selection-column>`

`<vaadin-grid-selection-column>` is a helper element for the `<vaadin-grid>` that provides default renderers and functionality for item selection.

Category: Layout
Built with: Lit
Library: Vaadin
Author: Vaadin
Package: @vaadin/grid
Component size: 16.2 kB JS (minified + gzipped, JS includes dependencies beyond the library)
Library size: 19.9 kB JS (shared by every Vaadin component, loaded once per page)
Popular: 4 out of 5
Downloads: 288,102/week · jsDelivr 9,088 hits/month (whole @vaadin/grid package)
Latest stable version: 25.3.2
Last published: Oct 2, 2026
Component last changed: Dec 16, 2025 (in 25.0.0)
License: Apache-2.0

<vaadin-grid-selection-column> is a helper element for the <vaadin-grid> that provides default renderers and functionality for item selection.

Example:

<vaadin-grid>
 <vaadin-grid-selection-column frozen auto-select></vaadin-grid-selection-column>

 <vaadin-grid-column>
   ...

By default the selection column displays <vaadin-checkbox> elements in the column cells. The checkboxes in the body rows toggle selection of the corresponding row items.

When the grid data is provided as an array of items, the column header gets an additional checkbox that can be used for toggling selection for all the items at once.

The default content can also be overridden

Attributes

auto-select
auto-width
drag-select
flex-grow
footer-part-name
footer-renderer
frozen
frozen-to-end
header
header-part-name
header-renderer
hidden
path
renderer
resizable
row-header
select-all
text-align
width

Events

select-all-changed