Columns

QuickGrid has two built-in column types, PropertyColumn and TemplateColumn. You can also create your own column types by subclassing ColumnBase.

Property column

PropertyColumn is for displaying a single value specified by the parameter Property. This column infers sorting rules automatically, and uses the property's name as its title if not otherwise set.

Optionally, use the Format parameter to give a format string to control how the value is displayed. For example, the format "c" displays numeric values as currency.

It's also possible to use PropertyColumn with a computed expression, like in the "Age in years" example below. In this case the column title can't be inferred automatically so you must specify it.

Template column

TemplateColumn uses arbitrary Razor fragments to supply contents for its cells. It can't infer the column's title or sort order automatically.

Using TemplateColumn, it's possible to add arbitrary Blazor components to your table cells. Remember that rendering many components, or many event handlers, can impact the performance of your grid. One way to mitigate this issue is by paginating or virtualizing your grid, since in those cases fewer components will be present at once.

Standard column parameters

The ColumnBase type, which all column must derive from, offers some common parameters:

• Title, to set the column title. Not applicable if you're using HeaderTemplate.
• Class, to set a CSS class name on the header and body cells for this column.
• Align, to align the column left/center/right.
• HeaderTemplate, to supply a Razor fragment that completely replaces the default header cell contents. If you use this, it's your responsibility to render any sort indicators you may want, and to call the grid's SortByColumnAsync if the header is clicked.
• ColumnOptions, to supply a Razor fragment that will appear in a popover if a "column options" button is clicked. There are examples of this on the Filtering page.
• Sortable, to indicate whether the grid should be sortable by this column. The default value varies based on the column type and other column-specific options.
• IsDefaultSortColumn, to indicate that the grid should be sorted by this column by default.
• InitialSortDirection, to indicate the default sort direction.
• PlaceholderTemplate, to supply a Razor fragment that will be used while the data load is pending. This is only applicable for virtualized grids.

Dynamic columns

You can make columns appear conditionally using normal Razor logic such as @if. Example: