In this post we will demonstrate you how to bind the VIBlend WPF DataGrid to "Invoices" view in the Nwind.mdb database, which is shipped with the installation. The control will be used to analyze sales per country and shippers companies.

At first you need to create a new instance of the NwindDataSet and InvoicesTableAdapter. Then you need to fill the table with data and set the DataContext property.

C#

NwindDataSet dataSet = new NwindDataSet();
InvoicesTableAdapter adapter = new InvoicesTableAdapter();
adapter.Fill(dataSet.Invoices);
this.DataContext = dataSet.Invoices;

VB .NET

Dim dataSet As New NwindDataSet()
Dim adapter As New InvoicesTableAdapter()
adapter.Fill(dataSet.Invoices)
Me.DataContext = dataSet.Invoices

The DataGrid fields that will represent data source fields are created in XAML markup. In order to format the currency data, you should specify the StringFormat property in the binding expression.

 <Window x:Class="DataBinding.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:DataBinding"
        Title="MainWindow" Height="350" Width="525" xmlns:viblendDataGrid="clr-namespace:VIBlend.WPF.Controls;assembly=VIBlend.WPF.DataGrid">
    <Grid>
        <Grid.Resources>
            <DataTemplate x:Key="CellTemplate">
                <TextBlock HorizontalAlignment="Right" Text="{Binding StringFormat=C2}"/>
            </DataTemplate>
        </Grid.Resources>
        <viblendDataGrid:DataGrid ItemsSource="{Binding}" Name="dataGrid1" Margin="10">
            <viblendDataGrid:DataGrid.BoundFields>
                <viblendDataGrid:BoundField Text="Shippers Company" DataField="Shippers_CompanyName"/>
                <viblendDataGrid:BoundField Text="Country" DataField="Country"/>
                <viblendDataGrid:BoundField Text="ExtendedPrice" DataField="ExtendedPrice"/>
            </viblendDataGrid:DataGrid.BoundFields>
            <viblendDataGrid:DataGrid.BoundPivotRows>
                <viblendDataGrid:BoundField Width="100" Text="Country" DataField="Country"/>
            </viblendDataGrid:DataGrid.BoundPivotRows>
            <viblendDataGrid:DataGrid.BoundPivotColumns>
                <viblendDataGrid:BoundField Text="Shippers Company" DataField="Shippers_CompanyName"/>
            </viblendDataGrid:DataGrid.BoundPivotColumns>
            <viblendDataGrid:DataGrid.BoundPivotValues>
                <viblendDataGrid:BoundValueField CellDataTemplate="{StaticResource CellTemplate}" Text="Sum" DataField="ExtendedPrice" Function="Sum"/>
                <viblendDataGrid:BoundValueField CellDataTemplate="{StaticResource CellTemplate}" Text="Average Price" DataField="ExtendedPrice" Function="Average"/>
            </viblendDataGrid:DataGrid.BoundPivotValues>
        </viblendDataGrid:DataGrid>
    </Grid>
</Window>

Here is an image of the result: