Grouping In DataGrid In Silverlight 3 Application

This is how our application will look like if you design in Expression Blend 3:

I have just added a DataGrid to the application.
For sample data add a class and define your properties in it. I have added a class and named it as Users.cs; I have defined the following properties.


{codecitation class="brush: csharp; gutter: true;" width="650px"}

public class Users
{
public string Name { get; set; }
public int Age { get; set; }
public string Country { get; set; }
}



{/codecitation}

Now in MainPage.xaml.cs inside of constructor add some sample data and add it to the Item Source of the DataGrid.

{codecitation class="brush: csharp; gutter: true;" width="650px"}

public MainPage()
{
InitializeComponent();

List<Users> myList = new List<Users>
{
new Users{ Name="Hiro Nakamura", Age=24, Country="Japan"},
new Users{ Name="Mohinder Suresh", Age=26, Country="India"},
new Users{ Name="Claire Bennette", Age=19, Country="USA"},
new Users{ Name="Matt Parkman", Age=30, Country="USA"},
new Users{ Name="Nathan Patrelli", Age=30, Country="USA"},
new Users{ Name="Peter Patrelli", Age=26, Country="USA"},
new Users{ Name="Mica", Age=12, Country="USA"},
new Users{ Name="Linderman", Age=56, Country="USA"},
new Users{ Name="Ando", Age=24, Country="Japan"},
new Users{ Name="Maya", Age=24, Country="Mexico"},
new Users{ Name="Hiro Nakamura", Age=26, Country="Japan"},
new Users{ Name="Hiro Nakamura", Age=26, Country="Japan"},
};

MyDataGrid.ItemsSource = myList;
}


{/codecitation}

Now to test your application run it, and you will find the following screen:

Suppose we want to group the Users Country wise, in this case users from different countries will be grouped.
To achieve this, you need to use the assembly reference System.Windows.Data.
There is a class called PagedCollectionView, use it as follows:

{codecitation class="brush: csharp; gutter: true;" width="650px"}
public partial class MainPage : UserControl
{
PagedCollectionView collection;

public MainPage()
{
InitializeComponent();

List<Users> myList = new List<Users>
{
new Users{ Name="Hiro Nakamura", Age=24, Country="Japan"},
new Users{ Name="Mohinder Suresh", Age=26, Country="India"},
new Users{ Name="Claire Bennette", Age=19, Country="USA"},
new Users{ Name="Matt Parkman", Age=30, Country="USA"},
new Users{ Name="Nathan Patrelli", Age=30, Country="USA"},
new Users{ Name="Peter Patrelli", Age=26, Country="USA"},
new Users{ Name="Mica", Age=12, Country="USA"},
new Users{ Name="Linderman", Age=56, Country="USA"},
new Users{ Name="Ando", Age=24, Country="Japan"},
new Users{ Name="Maya", Age=24, Country="Mexico"},
new Users{ Name="Hiro Nakamura", Age=26, Country="Japan"},
new Users{ Name="Hiro Nakamura", Age=26, Country="Japan"},
};

collection = new PagedCollectionView(myList);
collection.GroupDescriptions.Add(new PropertyGroupDescription("Country"));
MyDataGrid.ItemsSource = collection;
}
}


{/codecitation}

That’s it we are done. Run your application to see the Data in DataGrid grouped by Country:

Enjoy Coding.

Thank you

About the Author

Diptimaya Patra Description :I am a Master in Computer Application (MCA) from SRM University, Chennai. I am MCTS in ASP.Net Web Development, and MOSS 2007 Administration. I have extreme exposure to Microsoft Technologies in recent times like Silverlight 2, Silverlight 3. I am from Cuttack, Orissa. You can reach me using this mail (diptimaya.patra@gmail.com). Currently I am working as a Software Engineer in UST Global Inc in Trivandrum Center. Occupation :Software Engineer Company : UST Global. Location : India Follow me at twitter : http://twitter.com/dpatra