Bind DataGrid In WPF Using C#

We will use SQL Server 2008 for making our database and table and create our design for DataGrid in XAML format. After that bind that DataGrid in xaml.cs file.

Initial chamber

Step 1: Open Visual Studio 2010, Go to File, then New and click Projects. Under Visual C#, select WPF Application.

WPF Application

Design chamber

In the Solution Explorer there is a Main Window.xaml file. You will see something like the following mage.

Main Window

Here you have to drag and drop the DataGrid from the toolbox. Initially there will be no columns in the DataGrid. For that you have to write the following code to make columns.

You have to write the following code where XAML is written and all code should be in between <grid> </grid>.
  1.     <Window x:Class="WpfApplication3.MainWindow"  
  2.         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"  
  3.         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"  
  4.         Title="MainWindow" Height="350" Width="525">  
  5.     <Grid>  
  6.         <DataGrid AutoGenerateColumns="False" Height="217" HorizontalAlignment="Left" Margin="73,33,0,0" Name="dataGrid1" VerticalAlignment="Top" Width="364">  
  7.   
  8.             <DataGrid.Columns>  
  9.                   
  10.             <DataGridTextColumn Header="ID" Width="40" Binding="{Binding id}"></DataGridTextColumn>  
  11.             <DataGridTextColumn Header="FirstName" Width="100" Binding="{Binding fname}"></DataGridTextColumn>  
  12.             <DataGridTextColumn Header="LastName" Width="100" Binding="{Binding lname}"></DataGridTextColumn>  
  13.             <DataGridTextColumn Header="City" Width="100" Binding="{Binding city}"></DataGridTextColumn>  
  14.   
  15.   
  16.             </DataGrid.Columns>  
  17.   
  18.         </DataGrid>  
  19.   
  20.   
  21.         
  22.     </Grid>  
  23. </Window>  
Your design will look like the following screenshot:

design

Database chamber

In the database, I had made my table in SQL Server 2008. You can take help from local database or SQL Service based database and create a table:
Add New Table, then tbl_data.

table

After creating the table, you have to feed some data in the table, otherwise you will  get empty Datagrid at run time.

Code chamber

In this step right click inside the Main Window.XAML, then click View Code. You will get inside the coding part, similar to page.aspx.cs file; here the file name is Main Window.xaml.cs.

Main Window.xaml.cs
  1. using System;  
  2. using System.Collections.Generic;  
  3. using System.Linq;  
  4. using System.Text;  
  5. using System.Windows;  
  6. using System.Windows.Controls;  
  7. using System.Windows.Data;  
  8. using System.Windows.Documents;  
  9. using System.Windows.Input;  
  10. using System.Windows.Media;  
  11. using System.Windows.Media.Imaging;  
  12. using System.Windows.Navigation;  
  13. using System.Windows.Shapes;  
  14. using System.Data;  
  15. using System.Data.SqlClient;  
  16.   
  17. namespace WpfApplication3  
  18. {  
  19.     /// <summary>  
  20.     /// Interaction logic for MainWindow.xaml  
  21.     /// </summary>  
  22.     public partial class MainWindow : Window  
  23.     {  
  24.         public MainWindow()  
  25.         {  
  26.             InitializeComponent();  
  27.             refreshdata();  
  28.         }  
  29.   
  30.         public void refreshdata()  
  31.         {  
  32.             SqlConnection con = new SqlConnection(@"Data Source=NiluNilesh;Integrated Security=True");  
  33.             con.Open();  
  34.             SqlCommand cmd = new SqlCommand("select * from tbl_data", con);  
  35.             SqlDataAdapter sda = new SqlDataAdapter(cmd);  
  36.             Database1DataSet ds = new Database1DataSet();  
  37.             sda.Fill(ds);  
  38.             if (ds.Tables[0].Rows.Count>0)  
  39.             {  
  40.                 dataGrid1.ItemsSource = ds.Tables[0].DefaultView;  
  41.             }  
  42.             con.Close();  
  43.         }  
  44.     }  
  45. }  
Output chamber

Output

Hope you liked this. Have a good day. Thank you for reading.

 

X

Build smarter apps with Machine Learning, Bots, Cognitive Services - Start free.

Start Learning Now