Tuesday, August 25, 2009

WPF Toolkit Datagrid

DataGrid is part of User Interface.It is used for displaying data in tabular format.It provides sorting and editing functions. For using DataGrid in WPF

toolkit you have to first install WPF Toolkit. This Toolkit is open source. Datagrid is used for providing functions like create,update,delete,read on any data

source.Now lets start building our own WPF Application in which we will use a Datagrid....

For installing toolkit basic requirement is .Net Framework 3.5 SP1..If you have this installed on your machine you can install WPF Toolkit..For that you will

have to download WPF Toolkit (source or Binaries). You will get this here http://wpf.codeplex.com/Release/ProjectReleases.aspx?ReleaseId=29117
When downloading is done run WPFToolkit.msi to install the WPFToolkit.dll and WPF Toolkit design time binaries to your Program Files folder.

When you start coding basic things which you have to do are :

1) Reference WPFToolkit.dll in your project
2) Import "Microsoft.Windows.Controls" in ur vb code.
3) In your XAML file you will have to add a new xmlns "http://schemas.microsoft.com/wpf/2008/toolkit" at the top of XAML file. Example showing this will be given

below..

Lets take a simple example of Categories table which include columns catId (Category Id), catName (Category Name), catDesc (Category Description), parcatId

(Parent Category Id) in database..From this catId is integer,catName and catDesc is string while parcatId is also integer in database but while displaying for user we

want to display it in dropdown (combobox for datagrid here) which shows catName in list but gets saved as integer in database..So lets start coding...


<Page x:Class="pgCategory"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Width="509" Height="409"

<Grid>
</Grid>
</Page>

This is the basic part generated when you open an XAML page..

xmlns:dd="http://schemas.microsoft.com/wpf/2008/toolkit"
xmlns:dg="clr-namespace:Microsoft.Windows.Controls;assembly=WPFToolkit"

These are two important things of adding references like that of toolkit without which you cant include Datagrid in your form..

Now lets see datagrid part..

<Grid.Resources>
<ObjectDataProvider x:Key="categoryDataProvider" ObjectType="{x:Type local:Categories}" MethodName="GetCategories"/>
</Grid.Resources>

Here ObjectDataProvider defines an instance of the above class as our data source which includes objecttype and methodname through which it gives data..

<dg:DataGrid AlternatingRowBackground="AliceBlue"
AutoGenerateColumns="False"
CanUserAddRows="True"
CanUserDeleteRows="True"
Height="151"
IsReadOnly="False"
ItemsSource="{Binding Path=.}"
MaxColumnWidth="500"
MinColumnWidth="50"
Name="pgCategoryDG"
RowBackground="White"
RowDetailsVisibilityMode="VisibleWhenSelected"
RowHeaderWidth="25"
SelectionUnit="FullRow"
VerticalAlignment="Bottom"
Loaded="pgCategoryDG_Loaded" MouseDoubleClick="pgCategoryDG_MouseDoubleClick">

<dg:DataGrid.Columns>
<dg:DataGridTextColumn x:Name="dgcatName" Header="Category Name" Width="100" Binding="{Binding catName}" IsReadOnly="False"/>
<dg:DataGridTextColumn x:Name="dgcatDesc" Header="Category Description" Width="125" Binding="{Binding catDesc}" IsReadOnly="false"/>
<dg:DataGridComboBoxColumn SelectedValueBinding="{Binding parcatId}" SelectedValuePath="parcatId" DisplayMemberPath="catName" ItemsSource="{Binding

Source={StaticResource categoryDataProvider}}"/>
</dg:DataGrid.Columns>
</dg:DataGrid>
<Button HorizontalAlignment="Left" Margin="165,148,0,0" Name="btnSave" Width="75" Height="23" VerticalAlignment="Top">Save</Button>

Here combobox is used for dropdown list in which parcatId is gonna be considered and catName wil be displayed..Many other properties of datagrid are mentioned

here above..Also there is a Save button which when clicked things will be saved in databse..Based on this XAML file is our vb code which is as follows :-

Imports System.Windows.Controls
Imports System.Windows.Data

Partial Public Class pgCategory

Private Sub btnSave_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) Handles btnSave.Click
Dim dtCategories As System.Data.DataTable = pgCategoryDG.DataContext
Dim dtDeleted As System.Data.DataTable
For Each r As System.Data.DataRow In dtCategories.Rows
If r.RowState = DataRowState.Modified Then
modGlobal.objInventoryService.UpdateCategories(r.Item(0), r.Item(1), r.Item(2), r.Item(3))
ElseIf r.RowState = DataRowState.Added Then
If IsDBNull(r.Item(1)) Then
MsgBox("Enter CatName!!!")
Else
If IsDBNull(r.Item(3)) Then
If IsDBNull(r.Item(2)) Then
modGlobal.objInventoryService.InsertCategory(r.Item(1), "")
Else
modGlobal.objInventoryService.InsertCategory(r.Item(1), r.Item(2))
End If
Else
If IsDBNull(r.Item(2)) Then
modGlobal.objInventoryService.InsertCategories(r.Item(1), "", r.Item(3))
Else
modGlobal.objInventoryService.InsertCategories(r.Item(1), r.Item(2), r.Item(3))
End If
End If
End If
End If
Next
dtDeleted = dtCategories.GetChanges(DataRowState.Deleted)
If Not dtDeleted Is Nothing Then
dtDeleted.RejectChanges()
For i As Integer = 0 To dtDeleted.Rows.Count - 1
modGlobal.objInventoryService.DeleteCategories(dtDeleted.Rows(i)(0))
Next
End If
dtCategories.AcceptChanges()
End Sub


Private Sub pgCategoryDG_Loaded(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs)
Dim a As System.Data.DataSet
a = modGlobal.objInventoryService.RetriveCategories()
pgCategoryDG.DataContext = a.Tables.Item(0)
End Sub


Public Class Categories
Public Function GetCategories() As System.Data.DataView
Dim a As System.Data.DataSet
a = modGlobal.objInventoryService.RetriveCategories()
Return a.Tables.Item(0).DefaultView
End Function
End Class

Here we have created another class called Categories which we have used for ObjectDataProvider. When form loads to display all data from database in Datagrid

we have written function Loaded. In code of Save button we have written code for inserting,deleting and updating. In that we have checked each row whether its Modified

(Update), Added (Insert), Deleted (Delete)..Based on that rowstate we can call our functions.

So this is the whole code for creating a datagrid project..I hope it will help you all to create your own Datagrid projects..I will post more blogs on Datagrid soon..

No comments:

Post a Comment