In the SfDataGrid, it is possible to change the GridCell style at run time. You can refer to know more about the GridCell style customization in the SfDataGrid. Normally, the GridCell can be customized based on the data present in the GridCell by using the CellStyleSelector. You can refer to know about the StyleSelectors in the SfDataGrid and refer to customize the GridCell based on the GridCell value.
To change the GridCell style on clicking a cell and also maintain that cell style when you click other cells, use the CurrentCellActivatedEvent along with the CellStyleSelector. In the following code example, on clicking the cell the foreground is changed by using the CellStyleSelector.
As mentioned earlier, the GridCell is customized based on the data. To change the style at runtime, you need two properties, the DataIndex and ColoredRows that are maintained in the model class, DataContext of the GridCell, here OrderInfo.
The CurrentCellActivated event is fired when you click the cell. By using this event, you can change the style of the GridCell that is clicked. Refer to the following code example.
In the CurrentCellActivated event, the GridCell is accessed with the help of the CurrentCellElement. From that cell, you can get the datacontext. Here, the datacontext is the underlying Business Object. Then column index of the clicked cell is assigned to the DataIndex. By default, DataIndex is considered as -1 for all the records.
Finally, you need to call the UpdateDataRow method to refresh the specified row and update the style. Refer to the following code example to define the style for the GridCell.
Refer to the following code example to change the GridCell style by using the CellStyleSelector class.
Here, the CellStyleSelector class is derived from the StyleSelector and overrides the SelectStyleCore method. In the SelectStyleCore method, record is accessed from the argument item and the columnindex of a GridCell is accessed from the argument container. The style returns based on the given conditions. As mentioned above, the DataIndex of the GridCell is changed based on its column index when the cell is clicked. Here, when the columnindex of a GridCell and the DataIndex are the same, then the DataIndex is added to the ColoredRows collection and the customized style is returned to change the foreground of the GridCell. When the columnindex is already present in the ColoredRows collection, then the customized style is returned to retain the foreground of the GridCell. Refer to the following code example to apply the customized style to the GridCell by using the CellStyleSelector.
The GridCell foreground has been changed on clicking the GridCell as displayed in the following screenshot.
Figure 1: GridCell Foreground changed to Red on clicking the cell
This page will automatically be redirected to the sign-in page in 10 seconds.