Skip to main content Skip to footer
Vue Icon

Selection for Vue Datagrids

Like Excel, Wijmo's Vue datagrid, FlexGrid, allows you to select a range of cells over multiple rows and columns. FlexGrid also allows you to modify the marquee of the selection, as well as set the selection through other components.

Selection

Wijmo's Vue datagrid, FlexGrid, allows users to select rows or cells either by clicking the items or using checkboxes. Select more than one row or cell by holding Ctrl, Shift, Command, or programmatically.

Selection Demo

Selection Documentation

Multiple Selection

By default, FlexGrid allows you to select a range of cells with either the mouse or keyboard. The Vue datagrid enables you to set the selection mode–permitting the selection of specific cells, continuous rows, or noncontiguous cells and rows.

Multiple Selection Demo

Checkbox Selection

FlexGrid supports the addition of checkboxes in cells, which control row selection. You are also able to implement a master checkbox that selects and deselects all of the rows inside the Vue datagrid.

Checkbox Selection Demo

Marquee

FlexGrid supports the implementation of an Excel-style marquee when the user selects a cell inside of the Vue datagrid. Customize the appearance of this marquee to fit your styling guidelines.

Marquee Demo

Marquee Documentation

Searching

If your FlexGrid has non-editable columns, you can use the datagrid's autoSearch to parse through the read-only columns. Users can select a cell in a read-only column and begin typing–prompting FlexGrid to change the current selection to match what the user enters.

Searching Demo