Silverlight 4: Applying Style to the Selected DataGrid Cell during Edit Operation

Silverlight DataGrid is a good control for data display and manipulation. This control provides various features to the developer for UI representation and customization. The DataGrid has lots of events for User Interaction. One of the event provided is PreparingCellForEdit, which is raised when a cell in the DataGrid column enters Editing mode. During this event, the DataGridCell is templated as the TextBox control and we can then manipulate data within the textbox.

In this article, I have used the ‘PreparingCellForEdit’ event to apply a style on the DataGrid Cell. First my XAML code defines the Style for the TextBox and when the cell is clicked, this style is applied on it.

Step 1: Open VS2010 and create a Silverlight application, name it as ‘SL4_DataGridCell’. In the MainPage.Xaml.cs add the following classes which acts as DataClasses.

Step 2: In the MainPage.xaml, add a DataGrid and define a Style targeting the TextBox element as below:

Step 3: In the MainPage.Xaml.cs, add the following code in the Loaded event and apply the Style programmatically to the DataGridCell using ‘PreparingCellForEdit’ event as below:

Step 4: Run the application and click on the cell, the result will be as shown below:

The entire source code of this article can be downloaded over here

Author

Mahesh Sabnis is a DotNetCurry author and Microsoft MVP having over 17 years of experience in IT education and development. He is a Microsoft Certified Trainer (MCT) since 2005 and has conducted various Corporate Training programs for .NET Technologies (all versions). Follow him on twitter @maheshdotnet