columns.selectable Boolean (default: false)

If set to true the grid will render a select column with checkboxes in each cell, thus enabling multi-row selection. The header checkbox allows users to select/deselect all the rows on the current page. The change event is fired when a row is selected.

Setting the columns.selectable to true overrides the selectable.mode configuration property if it is set to "single".

More about the Grid Selection feature you can find in this documentation article.

Example - enable multi-row selection by adding a select column with checkboxes

<div id="grid"></div>
  columns: [
    { selectable: true },
    { field: "name" }
  dataSource: [ { name: "Jane Doe" }, { name: "John Doe" } ]
In this article