How to bind a collection of objects to a DataGridView in Winforms

Question

If i have two objects, namely Fruit' andColor` and their definitions are as follows:

public class Fruit  
{  
  public int FruitId { get; set; }  
  public string Name { get; set; }  
  public Color Color { get; set; }  
}  

public class Color  
{  
  public int ColorId { get; set; }  
  public string Name { get; set; }  
}  

How do I bind a collection of Fruit (e.g. List<Fruit>) to a DataGridView? where the resulting output would be something similar to the following:

+-----+--------+----------+  
| Id  | Name   | Color    |  
+-----+--------+----------+  
| 10  | Apple  | Red      |  
| 20  | Orange | Orange   |  
| 30  | Grapes | Violet   |  
+-----+--------+----------+  

and NOT like the following output below: (Note: the N in N.Color indicates the namespace of the object Color)

+-----+--------+------------+  
| Id  | Name   | Color      |  
+-----+--------+------------+  
| 10  | Apple  | N.Color    |  
| 20  | Orange | N.Color    |  
| 30  | Grapes | N.Color    |  
+-----+--------+------------+  

Update #1:
I found a similar post here on SO and tried some of the suggestion on that post but it's not working...

Answer 1

You have multiple options.

You can override ToString method in your Color class to return Name like:

public class Color
{
    public int ColorId { get; set; }
    public string Name { get; set; }
    public override string ToString()
    {
        return Name;
    }
}  

Or instead of assigningList<Fruit> as DataSource you can select a list of anonymous object and select Name of Color in your result like:

var result = yourListOfFruit
                .Select(r => new
                        {
                            FruitID = r.FruitId, 
                            Name = r.Name, 
                            Color = r.Color.Name,
                        }).ToList();

dataGridView1.DataSource = result;

Answer 2

Ok, after a couple of days figuring out how to make my app work I managed to find some article that helped me a lot in solving my problem. I thought I'd share it here on SO for you guys so lets start:

First, lets assume we already have a list of fruit stored in a variable fruits, and lets assume we already got it's value from a method:

List<Fruit> fruits = method();  

Now, my problem was... If I bind that list to a datagridview using the following command:

datagridview.DataSource = fruits;  

It will give me a result similar to the following:

+-----+--------+------------+  
| Id  | Name   | Color      |  
+-----+--------+------------+  
| 10  | Apple  | N.Color    |  
| 20  | Orange | N.Color    |  
| 30  | Grapes | N.Color    |  
+-----+--------+------------+   

Which is not what I want. So I thought maybe if I somehow put each columns to the datagridview manually, I could specify which properties from my fruits list to display. So I did something like this:

DataGridViewColumn col3 = new DataGridViewTextBoxColumn();  
col3.DataPropertyName = "Color.Name";  
col3.HeaderText = "Color Name";  
dataGridView1.Columns.Add(col3);  

But then, specifying something like this Color.Name on the DataPropertyName of the DataGridView column is not working, and will only result to a blank column with no data being displayed on the DataGridView. In order for it to work, the DataGridView should have a cell formatting function to properly display it's value in that given column. For the complete tutorial on how to do the formatting, you can check it out here from Antonio Bello's blog.

And that's it, hope it helps you too ^_^