CODEWITHSUNDEEP
wpf
Yanshof
Yanshof

Reputation: 9926

How to do binding to column item on DataGrid

I define DataGrid with 3 column. Each of the column hold a collection of item.

I don't know how to do this binding between each of the column and the list of items that i want display on each column.

this is the code that i wrote so far 

<DataGrid Grid.Row="0" x:Name="table" AutoGenerateColumns="False">
        <DataGrid.Columns>

            <DataGridTextColumn Header="Result1" Width="*">
                // <list of item 1 >
            </DataGridTextColumn>

            <DataGridTextColumn Header="Result2" Width="*">
                // <list of item 2 >
            </DataGridTextColumn>

            <DataGridTextColumn Header="Result2" Width="*">
                // <list of item 3 >
            </DataGridTextColumn>
        </DataGrid.Columns>
    </DataGrid>

Upvotes: 0

Views: 52

Answers (1)

SamTh3D3v
SamTh3D3v

Reputation: 9944

A dataGrid is usually used to display a list of items that has several properties, for your case something like that:

public class Item
{
    public String Result1 { get; set; }
    public String Result2 { get; set; }
    public String Result3 { get; set; }
}

The binded collection

public ObservableCollection<Item> ListOfResultItems { get; set; }

and each property is binded to its coresponding column 

<DataGrid Grid.Row="0" x:Name="table" AutoGenerateColumns="False" ItemsSource="{Binding ListOfResultItems}">
        <DataGrid.Columns>

            <DataGridTextColumn Binding="{Binding Result1}" Header="Result1" Width="*">                    
            </DataGridTextColumn>

            <DataGridTextColumn Binding="{Binding Result2}" Header="Result2" Width="*">                  
            </DataGridTextColumn>

            <DataGridTextColumn Binding="{Binding Result3}" Header="Result2" Width="*">                    
            </DataGridTextColumn>
        </DataGrid.Columns>
    </DataGrid>

if you want to show three lists next to each other then i believe that one simple DataGrid isn't your best shot, i suggest you define three single column's DataGrids or ListViews, bind each List to the corresponding list, and based on your need, link their vertical scrolling or not.

<Grid >
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
    <DataGrid Grid.Column="0"  AutoGenerateColumns="False" ItemsSource="{Binding ListResult1}">
        <DataGrid.Columns>
            <DataGridTextColumn Binding="{Binding Name}" Header="Result1" Width="*">                    
            </DataGridTextColumn>              
        </DataGrid.Columns>
    </DataGrid>
    <DataGrid Grid.Column="1"  AutoGenerateColumns="False" ItemsSource="{Binding ListResult2}">
        <DataGrid.Columns>                
            <DataGridTextColumn Binding="{Binding Name}" Header="Result2" Width="*">                  
            </DataGridTextColumn>               
        </DataGrid.Columns>
    </DataGrid>
    <DataGrid Grid.Column="2"  AutoGenerateColumns="False" ItemsSource="{Binding ListResult3}">
        <DataGrid.Columns>
            <DataGridTextColumn Binding="{Binding Name}" Header="Result3" Width="*">
            </DataGridTextColumn>
        </DataGrid.Columns>
    </DataGrid>
</Grid>

and define your Results classes and define the collections 

public ObservableCollection<Result1> ListResult1 { get; set; }

public ObservableCollection<Result2> ListResult2 { get; set; }

public ObservableCollection<Result3> ListResult3 { get; set; }

Upvotes: 1

Related Questions