We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How to change the GridCell style at runtime?

In the SfDataGrid, it is possible to change the GridCell style at run time. You can refer here 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 here to know about the StyleSelectors in the SfDataGrid and refer here 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.

  • DataIndex - Denotes the column index of the clicked GridCell.
  • ColoredRows - Collection of DataIndex that is used to retain the GridCell style.

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.

C#

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.

XAML

Refer to the following code example to change the GridCell style by using the CellStyleSelector class.

C#

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.

XAML

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

 

Sample Link:


WRT

WPF

UWP

Article ID: Published Date: Last Revised Date: Platform: Control: .NET Framework: Product Version:
4186 02/28/2015 01/18/2016 WinRT SfDataGrid 4.5.1 12.4.0.24
Did you find this information helpful?
Add Comment
You must log in to leave a comment

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon