Blazor DataGrid Example - Fixed Columns
Drag a column header here to group its column
Order ID Press Ctrl space to group | Order Date Press Ctrl space to group | Customer ID Press Ctrl space to group | Freight Press Ctrl space to group | Ship Country Press Ctrl space to group | Ship City Press Ctrl space to group |
|---|
| 10001 | 5/15/1991 | ALFKI | $2.30 | Denmark | Berlin |
| 10002 | 4/4/1990 | ANATR | $3.30 | Brazil | Madrid |
| 10003 | 11/30/1957 | ANTON | $4.30 | Germany | Cholchester |
| 10004 | 10/22/1930 | BLONP | $5.30 | Austria | Marseille |
| 10005 | 2/18/1953 | BOLID | $6.30 | Switzerland | Tsawassen |
| 10006 | 5/15/1991 | ALFKI | $4.60 | Denmark | Berlin |
| 10007 | 4/4/1990 | ANATR | $6.60 | Brazil | Madrid |
| 10008 | 11/30/1957 | ANTON | $8.60 | Germany | Cholchester |
| 10009 | 10/22/1930 | BLONP | $10.60 | Austria | Marseille |
| 10010 | 2/18/1953 | BOLID | $12.60 | Switzerland | Tsawassen |
| 10011 | 5/15/1991 | ALFKI | $6.90 | Denmark | Berlin |
| 10012 | 4/4/1990 | ANATR | $9.90 | Brazil | Madrid |
This sample demonstrates the DataGrid fixed column feature for maintaining column visibility during horizontal scrolling.
The DataGrid allows you to freeze columns at the beginning of the grid using the FixedColumn property of the GridColumn. Set this property to true for columns that need to remain visible while scrolling horizontally.
In this demo, the OrderID and OrderDate columns are fixed as the first and second columns. These frozen columns cannot be reordered or grouped, ensuring they remain accessible when scrolling through other columns.
Multiple columns can be fixed and will appear in the order they are defined in the column collection.
For more information about the fixed column feature, refer to the fixed columns documentation.