DataGrid in WPF

Mahak Gupta
12y
9.8k
0
0

Article

In this article, we will discuss the DataGrid Control In WPF. In this example, we fill the data in the DataGrid with the help of a XML file. For this, follow these steps:

Step 1: Download the WPF Toolkit from the following Link:

http://wpf.codeplex.com/releases/view/40535

Step 2: Now we add the reference of this Toolkit in our WPf Project Like this:

Click on the Project Menu and then click on the Add Reference. The following window will be appear:

Now we add the reference from the window. The following code will be added in the .xaml page:

<Window x:Class="Binding_Data_In_WPF.Window1"
   xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
   Title="Window1" Height="300" Width="300" xmlns:my1="http://schemas.microsoft.com/wpf/2008/toolkit">
</Window>

Step 3: After that, we will add the XML file (Students.xml) to our project. This file is used to fill the data in the DataGrid.

<?xml version='1.0'?>
<Data>
<Student>
    <Id>1</Id>
    <Name>Mahak</Name>
    <Subject1>90</Subject1>
    <Subject2>80</Subject2>
    <Subject3>95</Subject3>
    <Subject4>70</Subject4>
    <Subject5>85</Subject5>
</Student>
<Student>
    <Id>2</Id>
    <Name>Juhi</Name>
    <Subject1>75</Subject1>
    <Subject2>95</Subject2>
    <Subject3>75</Subject3>
    <Subject4>65</Subject4>
    <Subject5>75</Subject5>
</Student>
<Student>
    <Id>3</Id>
    <Name>Pihu</Name>
    <Subject1>77</Subject1>
    <Subject2>95</Subject2>
    <Subject3>78</Subject3>
    <Subject4>69</Subject4>
    <Subject5>80</Subject5>
</Student>
</Data>

Step 4: After that, we write the following code in the .xaml page.

<Window.Resources>

        <XmlDataProvider x:Key="StudentData" Source="C:\Users\dell\Desktop\Binding Data In WPF\Binding Data In WPF\Students.xml"
            XPath="Data"/>
    </Window.Resources>

Step 5: Now we add the DataGrid in our Page. Since it is part of the WPF toolkit, we write the following code in it:

<StackPanel>
        <my1:DataGrid
           DataContext="{StaticResource StudentData}"
           ItemsSource="{Binding XPath=Student}"
           AutoGenerateColumns="False" Height="Auto"
           Name="dataGrid1" Margin="0,25,0,0"
           VerticalAlignment="Top" HorizontalAlignment="Stretch">

            <my1:DataGrid.Columns>
                <my1:DataGridTextColumn
                   Header="Id"
                   Binding="{Binding XPath=Id}"/>
                <my1:DataGridTextColumn

                   Header="Name"
                   Binding="{Binding XPath=Name}"/>
                <my1:DataGridTextColumn
                  Header="Subject1"
                   Binding="{Binding XPath=Subject1}"/>
                <my1:DataGridTextColumn
                   Header="Subject2"
                   Binding="{Binding XPath=Subject2}" />
                <my1:DataGridTextColumn
                   Header="Subject3"
                   Binding="{Binding XPath=Subject3}" />
                <my1:DataGridTextColumn
                   Header="Subject4"
                   Binding="{Binding XPath=Subject4}" />
                <my1:DataGridTextColumn
                   Header="Subject5"
                   Binding="{Binding XPath=Subject5}" />