Blazorise DataGrid: Display Template

Blazor includes templated components that can accept one or more UI segments as input and render them as part of the component during component rendering. DataGrid is a templated Blazor component that lets you customize various parts of the user interface with template parameters. It enables you to generate custom components or content using your own logic.

Examples

<DataGrid TItem="Employee"
          Data="@employeeList"
          Responsive>
    <DataGridNumericColumn Field="@nameof( Employee.DateOfBirth )" Caption="Birth Date" Editable>
        <DisplayTemplate>
            @{
                var date = context.Item?.DateOfBirth;

                if ( date != null )
                {
                    @($"{date.Value.ToShortDateString()} | Age: {( DateTime.Now.Year - date.Value.Year )}")
                }
            }
        </DisplayTemplate>
    </DataGridNumericColumn>
</DataGrid>

@code {
    private readonly EmployeeData EmployeeData = new();
    private List<Employee> employeeList;


    protected override async Task OnInitializedAsync()
    {
        employeeList = await EmployeeData.GetDataAsync();
        await base.OnInitializedAsync();
    }
}

API

See the API reference for the parameters, events, methods, and related types available to the components covered on this page.

• <DataGrid />