Selection Column

 
Selection
Product Name Category Unit Price Units in Stock Quantity per Unit Discontinued
ChaiBeverages$18.003910 boxes x 20 bags
ChangBeverages$19.001724 - 12 oz bottles
Aniseed SyrupCondiments$10.001312 - 550 ml bottles
Chef Anton's Cajun SeasoningCondiments$22.005348 - 6 oz jars
Chef Anton's Gumbo MixCondiments$21.00036 boxes
Grandma's Boysenberry SpreadCondiments$25.0012012 - 8 oz jars
Uncle Bob's Organic Dried PearsProduce$30.001512 - 1 lb pkgs.
Northwoods Cranberry SauceCondiments$40.00612 - 12 oz jars
Mishi Kobe NikuMeat/Poultry$97.002918 - 500 g pkgs.
IkuraSeafood$31.003112 - 200 ml jars
Queso CabralesDairy Products$21.00221 kg pkg.
Queso Manchego La PastoraDairy Products$38.008610 - 500 g pkgs.
KonbuSeafood$6.00242 kg box
TofuProduce$23.003540 - 100 g pkgs.
Genen ShouyuCondiments$16.003924 - 250 ml bottles
PavlovaConfections$17.002932 - 500 g boxes
Alice MuttonMeat/Poultry$39.00020 - 1 kg tins
Carnarvon TigersSeafood$63.004216 kg pkg.
Teatime Chocolate BiscuitsConfections$9.002510 boxes x 12 pieces
Sir Rodney's MarmaladeConfections$81.004030 gift boxes
Data grid with 77 rows and 7 columns
24 rows are selected

The number of selected products: 24

Use our Blazor Grid's built-in selection column to simplify row selection. To display this column, declare a DxGridSelectionColumn object in the Columns template.

Multi Select Mode (default)

In multi select mode, the column contains check boxes. The Select All check box within the column's header selects/deselects all rows on the current page or all Grid pages. Use the SelectAllCheckboxMode property to specify check box behavior. Available property values are as follows:

  • Page — The check box affects all rows on the current Grid page.
  • AllPages — The check box affects all rows on all Grid pages.
  • Mixed — The check box affects all rows on the current Grid page. An additional drop-down button displays a context menu and allows users to select/deselect all rows on all Grid pages.

To hide the Select All check box, disable the column's AllowSelectAll option.

Single Select Mode

When set to Single, the SelectionMode property allows users to select a single row.

In this demo, the selection column contains check boxes so that users can select multiple rows. Use the combo box above the Grid to select the desired Select All check box mode.