Library Blazor Components NextGrid Articles Quick Start 1.Placing the component

1.Placing the component

After this is in place, a component can be injected a into page or within another component. Example:

razor
<div class=“container”>
    <DataGrid />
</div>

First, a type parameter T should be set. This parameter represents a type of a single item inside grid. Example:

razor
<DataGrid T="Product" />

This type is usually a model class, for example:

cs
public class Product
{
    public string Title { get; set; } = "";
    public double Price { get; set; } = 0;
    public int Stock { get; set; } = 0;
}

By setting T type parameter, a reference of this type will be available within template for a cell.

razor
<DataGrid T="Product" ItemsSource="ProductsList">
    <GridColumn HeaderText="Price" Size="60px">
        <CellTemplate>
            @context.Price <em>USD</em>
        </CellTemplate>
    </GridColumn>
</DataGrid>

Specifying CellTemplate is not required and specific property of the item can be set via DataField property.

Sign in