Silverlight 3 Beta is now public and with many new and exciting feature. As you may know I'm a big fan of the DataGrid control in Silverlight. It is already very powerful and is improving every day.

So I have asked Yifung Lin, one of the developer of the DataGrid control, to provide a quick overview of what is new for Silverlight 3:

RowGrouping

RowGrouping is very simple to configure.  You simply add GroupDescriptions to the DataGrid based on the properties that we want to group by.

xmlns:data="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data"

xmlns:compmod="clr-namespace:System.Windows.Data;assembly=System.ComponentModel"

<data:DataGrid x:Name="dataGrid" AutoGenerateColumns="False" Margin="50">

<data:DataGrid.Columns>

<data:DataGridTextColumn Binding="{Binding ID}" Header="ID"  />

<data:DataGridTextColumn Binding="{Binding City}" Header="City"  />

<data:DataGridTextColumn Binding="{Binding Phone}" Header="Phone"  />

</data:DataGrid.Columns>

<data:DataGrid.GroupDescriptions>

<compmod:PropertyGroupDescription PropertyName="Country" />

<compmod:PropertyGroupDescription PropertyName="State" />

</data:DataGrid.GroupDescriptions>

</data:DataGrid>

Of course, you still need to give the DataGrid an ItemsSource like you use to, and that’s it:

Grouped by fields could be displayed in DataGridColumns, but they don’t need to be.  In this example, we’ve grouped by Country and State, but we’re only displaying columns for ID, City, and Phone. 

Alternatively, instead of adding GroupDescriptions directly on the DataGrid, you could add them to a CollectionView.

New Editing Events

Silverlight finally has explicit binding now in 3.0 so the DataGrid can now properly raise cancellable Ending events and Ended notifications.

public event EventHandler<DataGridCellEditEndingEventArgs> CellEditEnding;

public event EventHandler<DataGridCellEditEndedEventArgs> CellEditEnded;

public event EventHandler<DataGridRowEditEndingEventArgs> RowEditEnding;

public event EventHandler<DataGridRowEditEndedEventArgs> RowEditEnded;

Like before, the DataGrid supports transactional editing for entities that implement IEditableObject.

Cell Validation

By default, the built in framework validation also works in the DataGrid.  In the example above, if we enter text in the integer ID field, we’ll see the default framework error.

We didn’t need to do any work to get this behavior.  There was a type conversion error when the Binding tried to push “foo” back as an int.

The cell and the row are now in an invalid state and the DataGrid supports transitions to and from this new state.  Here you can see that the row turned pink.

Row Validation

The DataGrid takes advantage of DataAnnotations to support row level validation.  DataAnnotations can be used in a number of ways.  In this example, we’ll show a custom validator with a much hard coded algorithm for checking area codes

public static class OrderValidator
{

        public static bool DoesAreaCodeMatch(Order order, ValidationContext context, out ValidationResult validationResult)
        {

            validationResult = null;

            bool isValid = !order.City.Equals("Bellevue") || order.Phone.StartsWith("(425");

            if (!isValid)

            {

                List<string> properties = new List<string>() { "City", "Phone" };

                validationResult = new ValidationResult("Bellevue's area code is 425", properties);

            }

            return isValid;

        }
}

Once the validator is done, the user simply needs to set an attribute on the entity to specify the custom validator. 

[CustomValidation(typeof(OrderValidator), "DoesAreaCodeMatch")]
public class Order

The DataGrid does the rest:

Here, the DataGrid highlights the 2 cells that deal with the validation error.  Clicking on the error at the bottom toggles between the relevant cells.

Have fun with the new DataGrid control

ciao

Ronnie Saurenmann