articles

Home / DeveloperSection / Articles / Data Binding with DataGrid control

Data Binding with DataGrid control

Anonymous User9479 04-Mar-2011

In this demonstration we learn how to implement complex data binding in silverlight. Here we show that how to bind data with list box control. We know that complex data binding means to bind data with such type of controls which have a capacity to show more than one value at a time. Best example for complex data binding is ListBox control, ComboBox control and DataGrid control etc. Here we see that how to bind data with DataGrid control.

XAML code which represent  user interface of Data Binding control
<Grid x:Name="LayoutRoot" Background="White">
        <data:DataGrid AutoGenerateColumns="False" ItemsSource="{Binding}" Height="200" HorizontalAlignment="Left" Margin="43,36,0,0" Name="dataGrid1" VerticalAlignment="Top" Width="293" >
            <data:DataGrid.Columns>
                <data:DataGridTemplateColumn Header="Employee Id" Width="Auto">
                    <data:DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <TextBlock Text="{Binding ID}" />
                        </DataTemplate>
                    </data:DataGridTemplateColumn.CellTemplate>
                </data:DataGridTemplateColumn>
                <data:DataGridTemplateColumn Header="Employee Name" Width="Auto">
                    <data:DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <TextBlock Text="{Binding Name}" />
                        </DataTemplate>
                    </data:DataGridTemplateColumn.CellTemplate>
                </data:DataGridTemplateColumn>
                <data:DataGridTemplateColumn Header="Employee Age" Width="Auto">
                    <data:DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <TextBlock Text="{Binding Age}" />
                        </DataTemplate>
                    </data:DataGridTemplateColumn.CellTemplate>
                </data:DataGridTemplateColumn>
                <data:DataGridTemplateColumn Header="Employee City" Width="Auto">
                    <data:DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <TextBlock Text="{Binding City}" />
                        </DataTemplate>
                    </data:DataGridTemplateColumn.CellTemplate>
                </data:DataGridTemplateColumn>
            </data:DataGrid.Columns>
        </data:DataGrid>
</Grid>

NoteĂ For implementing this task drag and drop DataGrid control from Toolbox then make appropriate changes

Create a class named Employee
public class Employee
{
        public string ID { get; set; }
        public string Name { get; set; }
        public string Age { get; set; }
        public string City { get; set; }
}
Create a method name GetEmployeeData() in MainPage class
public List<Employee> GetEmployeeData()
{
            List<Employee> emp = new List<Employee>();
            emp.Add(new Employee() { Name = "Awadhendra", Age="22" , City="Allahabad" , ID="E0001" });
            emp.Add(new Employee() { Name = "Abhishek", Age="24" , City="Allahabad" , ID="E0002" });
            emp.Add(new Employee() { Name = "Amit", Age="30" , City="Kanpur" , ID="E0003" });
            emp.Add(new Employee() { Name = "Haider", Age="28" , City="Kanpur" , ID="E0004" });
            emp.Add(new Employee() { Name = "Sachindra", Age="25" , City="Allahabad" , ID="E0005" });
            emp.Add(new Employee() { Name = "Uttam", Age="32" , City="Lucknow" , ID="E0006" });
            return emp;
}
Write down the following code at the load event of User Control
private void UserControl_Loaded(object sender, RoutedEventArgs e)
{
            dataGrid1.DataContext = GetEmployeeData();
}
Save the application and then execute it

Data Binding with DataGrid control

 


Updated 04-Mar-2020
I am a content writter !

Leave Comment

Comments

Liked By