New to Telerik UI for Blazor? Download free 30-day trial

Grid Templates

You can customize the grid appearance and behavior through the various templates it provides so you can add more details for your users such as aggregate data, format numbers and dates, use custom editing logic, implement custom filters and more.

The Grid component can use templates for:

  • columns (cells) - the rendering of each cell (column). You can, for example, change string formats or add your own components.

  • rows - the entire rendering of the tr element of the row, so you can fully customize the grid behavior and rendering.

  • editing of a field - when a cell is in edit mode, it will render this template where you can use custom editors, components and logic.

  • column header - the title portion of the column.

  • column group footer - the footer of the column when the grid is grouped. You can use it, for example, to display aggregates.

  • group header - the shared section that denotes each grid group.

  • filter - the content of the filter cell or filter menu where you can implement custom rendering and logic for the filters.

  • no data available - when the Grid Data collection is empty or null, you can customize the content inside.

  • column chooser - the contents of the column chooser in the column menu. You can use this template to provide custom rendering.

  • pager - the template modifies the layout, content, and functionality of the Pager.

Like other Blazor content, most of them can receive a context argument that is the type of the model. To use templates, you must bind the grid to a named model. The filter and header templates are the exception as they are not related to rows and models.

You must make sure to provide valid HTML in the templates.

See Also

In this article