Multiple Row Selection
- 7 minutes to read
In this mode, multiple data and/or group rows can be selected at one time. In a CardView, you can select multiple cards. In a TreeListView, you can select multiple nodes. To enable this mode, set the DataControlBase.SelectionMode property to MultiSelectMode.Row or MultiSelectMode.MultipleRow. The DataViewBase.NavigationStyle property must be set to GridViewNavigationStyle.Cell or GridViewNavigationStyle.Row.
Selecting Records in UI
End users can select multiple rows using Shift or Ctrl keys. Enable the TableView.UseIndicatorForSelection/TreeListView.UseIndicatorForSelection option to allow an end user to select a range of rows/nodes/cells by dragging the mouse along the Row Indicator Panel.
Web-style Row Selection
You can enable the Web Style Row Selection. When this feature is enabled, a Selector Column can be used to select/deselect individual rows and groups. To activate this feature, set the view's TableView.ShowCheckBoxSelectorColumn property to true.
- When the Web-style Row Selection feature is enabled, setting the TableView.RetainSelectionOnClickOutsideCheckBoxSelector property to true disables the Selection Rectangle feature.
- You cannot sort and filter by the Selector Column.
- Web-style row selection does not work with the InfiniteAsyncSource and InfiniteSource.
Selecting Records in Code
The GridControl provides multiple members which allow you to select/unselect multiple rows/cards/nodes:
Selects all rows/cards/nodes within a View.
Unselects any selected rows/cards/nodes within a View.
Selects multiple rows/cards/nodes, while preserving the current selection (if any).
Selects the specified row (or the treelist node).
Unselects the specified row (or the treelist node).
Gets or sets data objects that correspond to rows (or nodes in TreeListView) currently selected within a View.
Gets or sets the currently focused data row (if row multi-selection is disabled); or the first selected row (if row multi-selection is enabled).
Gets or sets the currently focused data row.
You can dynamically control selection availability and prevent end-users from selecting or unselecting rows/nodes/cards.
Set the DataViewBase.EnableSelectedRowAppearance property to false, to disable the specific decoration of selected rows.
The image below demonstrates the visual difference between two controls with the disabled and enabled DataViewBase.EnableSelectedRowAppearance option. The first four rows are selected in both the grids.
Example: How To Select Rows That Contain The Specified Value
This example shows how to select rows whose UnitPrice column contains a value equal to or greater than 20. To select rows, click the Select button.
GitHub Example: How to select rows that contain the specified value
<Window x:Class="DXGrid_SelectRows.Window1" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:dxg="http://schemas.devexpress.com/winfx/2008/xaml/grid" Title="Window1" Height="293" Width="494"> <StackPanel> <dxg:GridControl Name="grid" AutoGenerateColumns="AddNew" SelectionMode="Row" Height="220"> <dxg:GridControl.View> <dxg:TableView Name="tableView" AutoWidth="True" /> </dxg:GridControl.View> </dxg:GridControl> <Button Content="Select" Width="50" Height="30" Margin="5" HorizontalAlignment="Left" Click="Button_Click" /> </StackPanel> </Window>
Highlight Rows On Hover
<dxg:GridControl SelectionMode="Row"> <dxg:GridControl.View> <dxg:TableView HighlightItemOnHover="True" /> </dxg:GridControl.View> <!-- ... ---> </dxg:GridControl>