Search

Customizing the Grid Behavior

Selecting rows and cells

Grid rows can be selected by clicking the corresponding row header. Multiple rows can be selected by holding Ctrl (or Shift for continuous selection) keys while clicking. Selection can be cancelled by handling the rowSelecting event, and when the interaction is finished the rowSelected event is raised for every row in the selection.

Grid cells are selected by clicking on them, given that the allowCellSelect property is set to true (default). Otherwise, clicking on a grid cell will select the entire row.

If the cell belongs to an editable column, selecting it will also show its inplace editor. You can stop the cell selection by cancelling the cellSelecting event, and the inplace edit mode by cancelling the cellFocusing event.

Inplace editing of grid cells

A grid cell's value can be updated via a corresponding to its data type inplace editor, that appears when the cell is clicked. Changes, made to the cell value, are applied to the grid's model immediately. Input changes can be cancelled or modified by handling the rowUpdating event. After the change is accepted, the rowUpdated event is raised.

Inplace editing can be turned off for the entire grid by setting the allowEdit property to false, or at the column level by setting a column's editable property to false.

Adding rows

By default, an empty row is shown at the bottom of the grid control, that allows users to add new records by typing in one of its cells. A shortcut to the new row is provided in the context menu, that is shown upon right-click on a row header. You can stop the empty row from appearing by setting the allowAppend property to false.

Deleting rows

Selected rows can be deleted interactively by using the "Delete row(s)" option of the context menu, that is shown upon right-click on a row header. You can disable the option by setting the allowDelete property to false.

Sorting columns

Clicking the header of a column will toggle its sorting. A context menu with sorting options is also available on column header right-click. Sorting can be turned off at the column level by setting a column's sortable property to false.