Xceed DataGrid for WPF v7.2 Documentation
Binding to a Master/Detail Data Table

Welcome to Xceed DataGrid, Editors, and 3D Views for WPF v7.2 > Xceed DataGrid for WPF > Code Snippets > Binding to a Master/Detail Data Table

The following example demonstrates how to bind a grid to a DataTable that contains DataRelations that will be displayed as child and grandchild detail data.

The code below demonstrates how to create a connection to the Access version of the Northwind database and create a property named "Employees" that retrieves its values from the Employees data table and to which a child and grandchild detail are added.

VB.NET
Copy Code 
Shared Sub New()

  Dim dataSet As New DataSet()

  Dim mdbfile As String = "Data\Northwind.mdb"

  Dim connString As String = String.Format("Provider=Microsoft.ACE.OLEDB.12.0; Data Source={0}", mdbfile)

  Dim conn As New OleDbConnection(connString)

  Dim adapter As New OleDbDataAdapter()

  m_adapter = New OleDbDataAdapter()

  m_adapter.SelectCommand = New OleDbCommand( "SELECT * FROM Employees;", conn )

  m_adapter.Fill( dataSet, "Employees" )

  m_employees = dataSet.Tables( "Employees" )

  m_adapter = New OleDbDataAdapter()

  m_adapter.SelectCommand = New OleDbCommand( "SELECT * FROM Orders;", conn )

  m_adapter.Fill( dataSet, "Orders" )

  m_orders = dataSet.Tables( "Orders" )

 

  m_adapter = New OleDbDataAdapter()

  m_adapter.SelectCommand = New OleDbCommand( "SELECT * FROM [Order Details];", conn )

  m_adapter.Fill( dataSet, "Order Details" )

  m_orderDetails = dataSet.Tables( "Order Details" )

  m_employees.ChildRelations.Add( New DataRelation( "Employee_Orders", m_employees.Columns( "EmployeeID" ), m_orders.Columns( "EmployeeID" ) ) )

  m_orders.ChildRelations.Add( New DataRelation( "Order_OrderDetails", m_orders.Columns( "OrderID" ), m_orderDetails.Columns( "OrderID" ) ) )

End Sub

Public Shared ReadOnly Property Employees As DataTable

  Get

    Return m_employees

   End Get

End Property

Private Shared m_employees As DataTable

Private Shared m_orders As DataTable

Private Shared m_orderDetails As DataTable

Private Shared m_adapter As OleDbDataAdapter = Nothing
C#
Copy Code 
static App()

{

 DataSet dataSet = new DataSet();

 string mdbFile = @"Data\Northwind.mdb";

 string connString = String.Format( "Provider=Microsoft.ACE.OLEDB.12.0; Data Source={0}", mdbFile );

 OleDbConnection conn = new OleDbConnection( connString );

 m_adapter = new OleDbDataAdapter();

 m_adapter.SelectCommand = new OleDbCommand( "SELECT * FROM Employees;", conn );

 m_adapter.Fill( dataSet, "Employees" );

 m_employees = dataSet.Tables[ "Employees" ];    

  m_adapter = new OleDbDataAdapter();

  m_adapter.SelectCommand = new OleDbCommand( "SELECT * FROM Orders;", conn );

  m_adapter.Fill( dataSet, "Orders" );

  m_orders = dataSet.Tables[ "Orders" ];

 

  m_adapter = new OleDbDataAdapter();

  m_adapter.SelectCommand = new OleDbCommand( "SELECT * FROM [Order Details];", conn );

  m_adapter.Fill( dataSet, "Order Details" );

  m_orderDetails = dataSet.Tables[ "Order Details" ];

 m_employees.ChildRelations.Add( new DataRelation( "Employee_Orders", m_employees.Columns[ "EmployeeID" ], m_orders.Columns[ "EmployeeID" ] ) );

 m_orders.ChildRelations.Add( new DataRelation( "Order_OrderDetails", m_orders.Columns[ "OrderID" ], m_orderDetails.Columns[ "OrderID" ] ) );  

}

public static DataTable Employees

{

 get

 {

   return m_employees;

  }

}

private static DataTable m_employees;

private static DataTable m_orders;

private static DataTable m_orderDetails;

private static OleDbDataAdapter m_adapter = null;

The following code demonstrates how to bind the grid to the Employees property and provide a detail configuration for both detail relations to change their title and the item-container style of the first child detail.

XAML
Copy Code 
<Grid xmlns:xcdg="http://schemas.xceed.com/wpf/xaml/datagrid"

      xmlns:local="clr-namespace:Xceed.Wpf.Documentation">

 <Grid.Resources>

    <xcdg:DataGridCollectionViewSource x:Key="cvs_employees"

                                       Source="{Binding Source={x:Static Application.Current},

                                                        Path=Employees}"/>   

     <xcdg:IndexToOddConverter x:Key="rowIndexConverter" />

  

     <Style x:Key="alternatingDataRowStyle" TargetType="{x:Type xcdg:DataRow}">

        <Style.Triggers>

           <DataTrigger Binding="{Binding RelativeSource={RelativeSource Self},

                                  Path=(xcdg:DataGridVirtualizingPanel.ItemIndex),

                                  Converter={StaticResource rowIndexConverter}}"

                        Value="True">

              <Setter Property="Background" Value="AliceBlue"/>                   

           </DataTrigger>

        </Style.Triggers>

     </Style>

  </Grid.Resources>

 <xcdg:DataGridControl x:Name="EmployeesGrid"

                       ItemsSource="{Binding Source={StaticResource cvs_employees}}"

                       AutoCreateDetailConfigurations="True">  

    <xcdg:DataGridControl.Columns>

       <xcdg:Column FieldName="Photo"

                    Visible="False" />

    </xcdg:DataGridControl.Columns>

    <xcdg:DataGridControl.DetailConfigurations>

       <xcdg:DetailConfiguration RelationName="Employee_Orders"

                                 Title="Employee Orders"

                                 ItemContainerStyle="{StaticResource alternatingDataRowStyle}">

          <xcdg:DetailConfiguration.Columns>

             <xcdg:Column FieldName="EmployeeID"

                          Visible="False" />

          </xcdg:DetailConfiguration.Columns>

          <xcdg:DetailConfiguration.DetailConfigurations>

             <xcdg:DetailConfiguration RelationName="Order_OrderDetails"

                                       Title="Order Details"/>                   

          </xcdg:DetailConfiguration.DetailConfigurations>

      </xcdg:DetailConfiguration>

    </xcdg:DataGridControl.DetailConfigurations>       

 </xcdg:DataGridControl>

</Grid>

 

 

 

Copyright Xceed Software Inc

Send Feedback