DataGridHtmlDataCellDecorationEventArgs<T> Class
Provides data for the HtmlDataCellDecoration event.
Namespace: DevExpress.Blazor
Assembly: DevExpress.Blazor.v20.2.dll
Declaration
public class DataGridHtmlDataCellDecorationEventArgs<T> :
IDataGridElementAppearance,
IEquatable<IDataGridElementAppearance>
Type Parameters
Name | Description |
---|---|
T | The grid's data item type that equals the type of items stored in a bound data collection ( |
Remarks
The HtmlDataCellDecoration event allows you to change cell decoration settings. To change an individual row's decoration settings, handle the HtmlRowDecoration event.
The code below handles the HtmlRowDecoration and HtmlDataCellDecoration events to color data grid cells, rows, and columns according to their values.
<DxDataGrid Data="@DataSource"
HtmlRowDecoration="@OnHtmlRowDecoration"
HtmlDataCellDecoration="@OnHtmlDataCellDecoration">
<DxDataGridColumn Field="@nameof(Order.Product)"></DxDataGridColumn>
...
</DxDataGrid>
@code {
IEnumerable<Product> DataSource;
...
void OnHtmlRowDecoration(DataGridHtmlRowDecorationEventArgs<Order> eventArgs) {
if (eventArgs.VisibleIndex % 2 == 1)
eventArgs.CssClass = " table-dark";
if (eventArgs.DataItem != null && eventArgs.DataItem.UnitsInOrder > largeOrder)
eventArgs.CssClass = " table-warning font-weight-bold";
else
eventArgs.Attributes.Add("data-low-price", "");
}
void OnHtmlDataCellDecoration(DataGridHtmlDataCellDecorationEventArgs<Order> eventArgs) {
eventArgs.CssClass += " border-0";
if (eventArgs.FieldName == nameof(Order.Product)) {
if (eventArgs.RowVisibleIndex % 2 == 1)
eventArgs.Style += " background-color: rgb(169, 148, 200); color: black;";
else
eventArgs.Style += " background-color: rgb(210, 198, 233); color: black;";
if (eventArgs.DataItem.UnitsInOrder > largeOrder) {
eventArgs.CssClass += " font-weight-bold";
}
}
}
}
Inheritance
Object
DataGridHtmlDataCellDecorationEventArgs<T>
See Also
Feedback