Blazor DataGrid Example - Data Annotations
Order ID | Customer Identification | Employee ID | Freight | Ship City |
|---|---|---|---|---|
| 10241 | ALFKI | 1 | $32.28 | Reims |
| 10242 | ANANTR | 2 | $22.90 | Munster |
| 10243 | BLONP | 3 | $30.91 | Rio de Janeir |
| 10244 | ANTON | 4 | $50.52 | Empty |
| 10245 | BOLID | 5 | $59.72 | Empty |
| 10246 | ALFKI | 6 | $32.28 | Reims |
| 10247 | ANANTR | 7 | $22.90 | Munster |
| 10248 | BLONP | 8 | $30.91 | Rio de Janeir |
| 10249 | ANTON | 9 | $50.52 | Empty |
| 10250 | BOLID | 10 | $59.72 | Empty |
| 10251 | ALFKI | 11 | $32.28 | Reims |
| 10252 | ANANTR | 12 | $22.90 | Munster |
This sample demonstrates the DataGrid component with data annotation features.
The Blazor DataGrid supports strong data binding through data annotations, allowing you to define column behavior, validation rules, and display formatting directly in your model classes. Import the System.ComponentModel.DataAnnotations namespace to use data annotations.
Data annotations enable you to:
- Modify column display format and header text
- Validate field input with predefined and custom rules
- Display custom messages to end-users
- Convert empty strings to null values
- Display custom text for null values
- Control automatic column generation
- Define primary keys and editable fields
In this demo, the following data annotation features are implemented:
- The DisplayAttribute modifies column header text.
- The DisplayFormatAttribute formats the Freight column display.
- The EditableAttribute disables editing for the ShipCity property.
- The KeyAttribute defines the OrderID as the primary key.
- The RequiredAttribute validates the CustomerID field.
- The RangeAttribute validates the Freight property range.
- The StringLengthAttribute validates the CustomerID string length.
For more detailed information about data annotations, refer to the data annotation documentation.